Cookie 未从响应传递到下一个请求答案

【问题标题】：Cookies not being passed from response to next requestCookie 未从响应传递到下一个请求
【发布时间】：2020-11-08 19:52:11
【问题描述】：

我正在尝试构建我的第一个 Web 应用程序，并且我正在使用 cookie 进行身份验证。

基本上，我的 React 客户端将身份验证凭据发送到我的 REST API，后者对其进行验证并在凭据有效时生成令牌。

当我在 chrome 上检查网络活动时，令牌设置在 /login POST 请求的响应标头上，但是当我尝试在此之后访问受保护的路由时，我得到一个 401 并检查请求显示cookie 没有出现在标题中。

我该如何解决这个问题？起初我认为这是一个 CORS 问题，但我似乎无法解决它。

登录调用的响应：

下一个请求时缺少 Cookie：

我是如何处理 CORS 问题的：

app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "http://localhost:8080");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Set-Cookie");
next();
  });

提前致谢。

【问题讨论】：

标签： node.js reactjs http web cookies

【解决方案1】：

您对受保护路由的下一个 POST 请求不包含 cookie，因为默认情况下它不发送 cookie。

如果你使用的是 axios。

设置withCredentials: true

axios.get(`api_url`, { withCredentials: true })

通过设置{ withCredentials: true }，您可能会遇到跨域问题。要解决这个问题，您需要使用

expressApp.use(cors({ credentials: true, origin: "http://localhost:8080" })); //Your REACT ADDRESS

在此处了解更多关于 withCredentials 的信息https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials

【讨论】：

【解决方案2】：

问题一定是因为 Set-cookie 属性 SameSite=strict。 SameSite 属性的工作方式如下。

SameSite=samesite-value

严格： 浏览器仅针对同站点请求（即来自设置 cookie 的同一站点的请求）发送 cookie。如果请求来自与当前 URL 不同的 URL，则不会发送具有 SameSite=Strict 属性的 cookie。

宽松： cookie 在跨站点子请求（例如加载图像或框架的调用）中被保留，但在用户从外部站点导航到 URL 时发送，例如通过以下方式一个链接。

无：浏览器发送带有跨站点和同站点请求的 cookie。

在您的情况下，后续请求也是跨源的，因此浏览器不会在标头中附加 cookie。如果 SameSite=None

它应该可以工作

【讨论】：