Cookie设置为不同的域（Node.js，Angular） [英] Cookies are set into different domain (Node.js, Angular)

问题描述

我正在使用Angular和Node.js（Express）开发Web应用程序，但我对Cookie遇到了问题-它们设置在我的后端域而不是我的前端域中。

当我向 / auth端点发出 POST请求时，服务器将返回HttpOnly cookie-一个是JWT，另一个是第二个是刷新令牌。当我检查chrome中的网络标签时，可以看到服务器将这些Cookie发送回去，但是当我检查应用程序>存储> Cookie时，这里什么也没有。

我发现了，则Cookie是在我的后端域上设置的。 （app-backend.com 而不是 app.com）它们只是与我的后端域相关联。

奇怪的是，我的应用程序在我的计算机上运行正常，但是当我切换到手机时，不会从那里发送cookie（我在使用iPhone和Safari或Chrome）。另外，当我在本地主机开发服务器上运行我的应用程序时，一切都正常。

我试图将cookie配置中的域设置为我的前端域，但它根本无法正常工作。

Chrome浏览器也会用此消息警告我，我不知道这是否与我的问题有关

设置了与我的域中的跨站点资源关联的cookie，但没有 SameSite 属性。如果将来的Chrome浏览器版本将Cookie设置为 SameSite = None 和 Secure ，则只会提供具有跨站点请求的Cookie。 。您可以在应用程序>存储> Cookies下的开发人员工具中查看Cookie，并在 https：// www中查看更多详细信息。 chromestatus.com/feature/5088147346030592 和 https://www.chromestatus.com/feature/ 5633521622188032 。

这是我在github上的代码：

前端： https://github.com/TenPetr/dashboard

后端： https://github.com/TenPetr/dashboard_backend

感谢您的建议。

解决方案

您正在设置 SameSite = None;您的 <$ c中的安全属性$ c> production.json 是正确的。但是，根据您的iOS / Safari版本，您可能会遇到不兼容问题 Cookie被错误地视为 SameSite = Strict 。

在开发设置中，您都是：没有设置 SameSite = None;安全，并且可能会使用无论如何都被视为同一网站的网址，例如在 localhost 上提供服务可能会导致一些奇怪的cookie行为。

我会尝试在不使用<$的情况下测试生产配置c $ c> SameSite = None 属性。如果它随后开始在Safari上运行，则说明您遇到了该错误。您可以通过设置Cookie的两个版本或添加用户代理嗅探来缓解这种情况。有关 https://web.dev/samesite-cookie-recipes 的更多详细信息， p>

或者，您可能会点击 Safari cookie策略问题，如果您尝试在后端服务器不是用户实际访问的站点时从后端服务器设置cookie。

I am doing web app using Angular and Node.js (Express) and I have a problem with cookies - they are set into my backend domain instead of my frontend.

When I make a POST request to /auth endpoint, server will return HttpOnly cookies - one is JWT and the second is refresh token. When I inspect network tab in chrome, I can see that server sent these cookies back, but when I inspect Application > Storage > Cookies, nothing is here.

I find out, that cookies are set on my backend domain. (app-backend.com instead of app.com) They are just simply associated with my backend domain.

Wierd thing is, that my app is working just fine on my computer, but when I switch to my phone, cookies are not sent from there (I am using iPhone with Safari or Chrome). Also, when I ran my app on localhost dev server, everything worked aswell.

I tried to set domain in cookie config to my frontend domain, it is not working at all.

Also, Chrome warns me with this message, I don't know if it has anything to do with my problem

A cookie associated with a cross-site resource at "my-domain" was set without the SameSite attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with SameSite=None and Secure. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.

Here is my code on github:

Frontend: https://github.com/TenPetr/dashboard

Backend: https://github.com/TenPetr/dashboard_backend

Thanks for your advices.

解决方案

You are setting the SameSite=None; Secure attributes in your production.json which is correct. However, depending on your version of iOS / Safari you may be hitting an incompatibility issue where the cookies are incorrectly treated as SameSite=Strict.

In your development set-up you are both: not setting SameSite=None; Secure, and might be using URLs that count as the same site anyway, e.g. serving on localhost can lead to some weird cookie behaviour.

I would try testing your production configuration without the SameSite=None attribute. If this then starts to work on Safari, then you are hitting that bug. You can mitigate this by either setting two versions of the cookie, or adding useragent sniffing. There are more details on https://web.dev/samesite-cookie-recipes

Alternatively, you may be hitting Safari cookie policy issues if you are attempting to set cookies from the back-end server when it's not a site the user actually visits.

这篇关于Cookie设置为不同的域（Node.js，Angular）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！