javascript - Javascript不会设置XHR响应中收到的httpcookie

我有一个基本的spa(react)<->api(net core 2.2)设置,有两个环境:dev和prod(小项目)。api端有一个身份验证机制,它检查包含jwt的每个请求中是否存在httponly cookie。
在开发环境中,它可以正常工作:在api中设置allowcReadentials(),在react应用程序中设置credentials=true。两者都在本地主机的不同端口上运行。
但在生产环境(独立的heroku dynos)中,它只是不会设置httponly cookie:我可以使用凭据登录,响应头包含jwt的cookie,但我将发出的每个其他请求都不会在请求头中包含cookie头!(然后我得到一个未经授权的401……这是合乎逻辑的)。我花了好几个小时试着做每件事,这让我发疯。
我的简单身份验证xhr(vanilla)调用:

var request = new XMLHttpRequest()
request.open('POST', apiAuthenticateUser, true)
request.setRequestHeader('Content-type', 'application/json')
request.withCredentials = true
request.send(postData)

.NET核心API中的myStartup.cs配置:
public void Configure(IApplicationBuilder app, IHostingEnvironment env) {
    if (env.IsDevelopment()) {
        app.UseDeveloperExceptionPage();
        IdentityModelEventSource.ShowPII = true;
    } else {
        app.UseHsts();
    }
    app.UseHttpsRedirection();

    app.UseCors(
        options => options.WithOrigins(
                "https://localhost:3000",
    "*productionEnvUrl*").AllowAnyMethod().AllowCredentials().AllowAnyHeader()
    );

    app.UseMvc(routes => {
        routes.MapRoute("MainRoute", "api/{controller}/{action}");
    });

    app.UseAuthentication();
}

这就是我如何在api控制器操作响应中设置包含jwt的httponly cookie:
Response.Cookies.Append("jwt", jwt, new CookieOptions { HttpOnly = true, Secure = true });

这两种环境下的代码是相同的,它们只会产生不同的结果。在这两种情况下,api都会在身份验证响应头中向我发送正确的cookie,但在生产环境中,react应用程序不会保留它并在其他api调用中将其发回。
以下是从API接收的cookie,它从未从Web应用程序发回:
Access-Control-Allow-Credentials    :true
Access-Control-Allow-Origin :https://xxxxxxxxxx.com
Connection  :keep-alive
Content-Type    :application/json; charset=utf-8
Date    :Mon, 09 Sep 2019 22:32:54 GMT
Server  :Kestrel
Set-Cookie  :jwt=xxxxxxxx; path=/; secure; samesite=lax; httponly
Transfer-Encoding   :chunked
Vary    :Origin
Via :1.1 vegur

如果有人有任何线索,我将永远感激:)在这里发疯!


最佳答案:

结果我错了很多事:
我的网络应用程序代码一切正常。
它在开发环境中运行,因为所有的东西都在本地主机上运行(只是不同的端口),SAMESITE=Lax(默认值)Cookie策略对其进行了授权。
为了使它跨域,您只需指定samesite=none,它就可以工作了。它会造成一些潜在的漏洞,因为您失去了对cookie的某些控制,但除非您设置一些反向代理/api网关机制,否则这是唯一可以绕过cookie(仅包括http)的方法。
我对“jwt只应存储在httponly cookies中”的规则过于兴奋:它也有漏洞,您仍然必须使应用程序xss(和其他技术)的其余部分安全。如果采取所有必要的预防措施,您可以将jwt安全地存储在本地存储器中。
感谢@crawyon violet的时间:)

译文:来源   文章分类: javascript asp.net-core request-headers response-headers cookie-httponly

相关文章:

javascript - AngularJS与Redux

javascript - 如何使jQuery .slideToggle()看起来滑动而不是折叠?

c# - OnClientClick正在停止回发

javascript - 你如何在JavaScript中测试NaN?

javascript - 在PDF中运行的JavaScript可以访问从其下载的域吗?

javascript - 如何使用嵌套引用验证JSON模式

javascript - 缓冲区与字符串速度:为什么String更快?

javascript - 在HTA文件中使用Javascript从Windows注册表读取/写入

javascript - 正则表达式以匹配Markdown代码块

javascript - 基于日期的Javascript重定向