时间戳

首页 > 解决方案 > 会话 Cookie 和 CORS。Cookie 设置不正确

node.js - 会话 Cookie 和 CORS。Cookie 设置不正确

问题描述

我的问题：我有一个服务器和一个应用程序在 2 个不同的域上运行。

  1. Heroku 上的 Node.js Express API
  2. 使用 CloudFront 的 S3 存储桶中的 Vue.JS 应用程序

调用 POST /login 工作正常，我被返回一个 cookie。调用 GET /projects 我遇到了 401。

如果您检查请求和响应，您将看到第二个项目调用发送了不正确的 cookie。似乎 cookie 设置不正确。

登录呼叫请求

Host: ***-***.herokuapp.com
Connection: keep-alive
Content-Length: 56
Accept: application/json, text/plain, */*
DNT: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36
Content-Type: application/json;charset=UTF-8
Origin: https://***.********.nl
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: https://***.********.nl/login
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en;q=0.9,en-US;q=0.8,nl;q=0.7,de;q=0.6

登录呼叫响应

Server: Cowboy
Connection: keep-alive
X-Dns-Prefetch-Control: off
X-Frame-Options: SAMEORIGIN
Strict-Transport-Security: max-age=15552000; includeSubDomains
X-Download-Options: noopen
X-Content-Type-Options: nosniff
X-Xss-Protection: 1; mode=block
Access-Control-Allow-Origin: https://***.********.nl
Vary: Origin
Access-Control-Allow-Credentials: true
Content-Type: application/json; charset=utf-8
Content-Length: 103
Etag: W/"67-AcqjF7Jne+FP4OtwKOHMGKpgbHY"
Set-Cookie: SessionId=s%3AyWaalYxA-qU2KY3gvGbg0x1K3Ro7jjwI.d%2B8CZS3m6YCKL0X1TQSlm2TW3ihUaV%2BnfGpj3SsylEE; Path=/; HttpOnly; Secure; SameSite=None
Date: Sat, 18 Jul 2020 18:26:41 GMT
Via: 1.1 vegur

项目调用请求

GET /api/v1/projects/ HTTP/1.1
Host: ***-***.herokuapp.com
Connection: keep-alive
Accept: application/json, text/plain, */*
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36
DNT: 1
Origin: https://***.********.nl
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: https://***.********.nl/
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en;q=0.9,en-US;q=0.8,nl;q=0.7,de;q=0.6
Cookie: SessionId=s%3Am5eOkHADAMTBXXdbnB3WwaEjsM8M6uqZ.8Ew5jim5S0iXei4DvucMZ%2BQv8LbUYteBE%2Bt6pVvtzEM

项目调用响应

HTTP/1.1 401 Unauthorized
Server: Cowboy
Connection: keep-alive
X-Dns-Prefetch-Control: off
X-Frame-Options: SAMEORIGIN
Strict-Transport-Security: max-age=15552000; includeSubDomains
X-Download-Options: noopen
X-Content-Type-Options: nosniff
X-Xss-Protection: 1; mode=block
Access-Control-Allow-Origin: https://***.********.nl
Vary: Origin
Access-Control-Allow-Credentials: true
Content-Type: application/json; charset=utf-8
Content-Length: 45
Etag: W/"2d-dzHmdZiZSbYibOdmu6CEgThdGrs"
Date: Sat, 18 Jul 2020 18:26:42 GMT
Via: 1.1 vegur

快速 CORS 配置

this.app.use(cors({
      origin: ["https://********.nl", "https://***.********.nl", /\.********\.nl$/], 
      credentials: true
    }))

Passport.js 配置

    cookie: {
      production: true,
      maxAge: null,
      sameSite: 'none',
      secure: true,
    }

CloudFront 配置

CloudFront 配置

标签： node.jsamazon-web-servicesvue.jscookiescors

解决方案

这有点投机，但它太长了，无法放入评论中，所以我试图将它作为一个答案来代替......

这里的关键问题是其他 cookie 是从哪里来的？我看到两种可能性：

  1. 在登录请求之后，还有另一个请求将其设置为该新值。
  2. 另一个饼干一直在那里。这是一个在过去某个时间点设置的旧 cookie，而新 cookie 只是被忽略了。

您在问题中没有提到的一件事是第二个请求是否总是发送相同的 cookie。这将使我们能够区分我上面概述的两种情况。

我注意到原始登录请求不包含cookie请求标头。这很有趣，因为如果流氓 cookie 是旧 cookie，那么它也应该包含在该请求中。

基于所有这些，我的理论是您没有在登录请求上设置withCredentials标志。true这可以解释为什么没有cookie请求标头，也可以解释为什么返回的set-cookie响应标头被忽略。

为了清楚起见，您需要设置withCredentials两个请求。仅在第二个请求上设置它是不够的。鉴于第二个请求包含一个cookie标头，看起来第二个请求确实已经withCredentials设置。

我也建议你看看chrome://settings/siteData。这将向您准确显示设置了哪些 cookie，并允许您删除特定的 cookie。尝试删除相关的 cookie，然后查看它是否在您登录时设置。

推荐阅读