Node Express 服务器无法在 AWS ELB 环境中设置 cookie

Question

我的 Express 应用程序中有一个 middle wear，它在客户端浏览器中设置了一个 cookie：

 res.cookie('token', '123');

在前端调用本地服务器的本地环境中一切正常：

 axios
  .post(`http://localhost:3000/createSomething`, { 'field': "value"})
  .then(res => {
    console.log('res', res)
  })
  .catch(err => {
    return Promise.reject(
      new Error('There is an issue with the /createSomething endpoint')
    );
  });

在这种情况下，cookie 已设置，我可以在我的开发工具中的 Cookie 部分下看到它。问题是当我将前端调用更改为指向 AWS Elastic Beanstalk 环境时：

http://localhost:3000/createSomething -> https://testEnvironment.com/createSomething

调用成功但没有在客户端浏览器中创建cookie。虽然，在回复中 headers 我确实看到了：

set-cookie: paigetoken=123; Path=/

一些进一步的细节：

set-cookie末尾有黄色警告符号。
使用 CORS
AWS 环境中有一个处理 https 的应用程序负载均衡器。这可能是一个因素吗？

如何解决此问题并让我在 AWS ELB 环境中的 Express 应用程序在客户端浏览器中成功设置 cookie？任何见解将不胜感激！

Answer 1

您需要将 SameSite=None; Secure 与 set-cookie 信息一起传递为 set-cookie: paigetoken=123; Path=/;SameSite=None; Secure

Chrome 不允许在不使用 SameSite 选项的情况下从域设置 cookie。

https://digiday.com/media/what-is-chrome-samesite/

PS：当请求来自本地环境时忽略。 (localhost/127.0.0.1)

在 NodeJs 中，它会像这样工作。

res.cookie('token', '123', { sameSite: 'None', path: '/', secure: true })

这里有一些参考：

http://expressjs.com/en/4x/api.html#res.cookie

Answer 2

1。更改请求 URL:

由于我不完全确定您的环境是如何设置的，问题可能是客户端正在从 localhost 请求信息，这意味着它将从客户端的同一台机器请求数据。尝试将客户端代码中的 URL 更改为：

`${location.origin}/createSomething`

2。如果这不起作用：

这在大多数浏览器中都存在安全问题。想象一下，一个恶意站点覆盖登录令牌 cookie，让我们说 Google。为了让服务器设置 cookie，location.origin 必须在客户端和请求的端点中匹配。

您可以使用的解决方法是让服务器发送一个响应，告诉客户端在 front-end.

上设置 cookie

例如：在服务器上，您可以执行类似这样的操作来发送带有 cookie 信息的 header。

res.set('X-SetCookie', JSON.stringify({ name: "token", value: "123" }));

然后在客户端中，像这样实际设置 cookie。

axios
  .post(`http://localhost:3000/createSomething`, { 'field': "value"})
  .then(res => {

    // Set cookie function.
    function setCookie({ name, value, expires = 1000*60*60*24*365 }) {
        const time = new Date();
        time.setTime(time.getTime() + expires);
        document.cookie = `${name}=${value};expires=${time.toUTCString()};path=/`;
    }

    // If response has the X-SetCookie header, set the cookie client side.
    if(res.headers.hasOwnProperty("X-SetCookie")) setCookie(JSON.parse(res.headers["X-SetCookie"]));
    
    console.log('res', res)
  })

只需确保正确配置 CORS，以便浏览器可以看到 header：Axios get access to response header fields

Node Express 服务器无法在 AWS ELB 环境中设置 cookie

Node Express server unable to set cookie in AWS ELB environment

amazon-web-services

express

cookies

cross-domain

aws-application-load-balancer

1。更改请求 URL:

2。如果这不起作用：