部署到heroku时，texpress-session未在反应应用程序中设置cookie答案

【问题标题】：texpress-session not setting cookie in react app when deployed to heroku部署到heroku时，texpress-session未在反应应用程序中设置cookie
【发布时间】：2021-07-24 21:11:12
【问题描述】：

我无法使用我的 MERN 堆栈应用程序在浏览器中设置会话 cookie。当 express 服务器和 react 前端都在本地运行时，cookie 设置没有问题。在我将 express 后端部署到 heroku 后，问题就出现了。我尝试将“sameSite”cookie 选项设置为“lax”或false，但问题仍然存在。

这是我用于快速会话的配置。

sessionConfig = {
secret: process.env.SESSION_SECRET,
resave: false,

saveUninitialized: true,
cookie: {
  secure: false,
  httpOnly: true,
  expires: expiryDate,
  sameSite: "lax",
},
store: MongoStore.create({
  mongoUrl: process.env.MONGO_CONNECTION_STRING,
}),
}

app.set("trust proxy", 1);
app.use(cors({ origin: true, credentials: true }));
app.use(session(sessionConfig));

编辑：进一步澄清。如果我从浏览器访问我的 express 应用程序的根路由，即使应用程序已部署，cookie 也会正常设置。（IE：如果我输入已部署的 heroku 应用程序的 url，则会话 cookie 已设置）如果我拨打电话从本地运行的反应前端（使用 fetch api）到部署的后端，cookie 没有设置。这让我认为这可能与相同的站点 cookie 选项有关。

【问题讨论】：

标签： javascript node.js reactjs express heroku

【解决方案1】：

我意识到是什么导致了问题。这是 chrome 中的一项安全功能，不允许将 sameSite cookie 选项设置为 none，除非 cookie 也设置为安全。你可以在这里issue with cross-site cookies: how to set cookie from backend to frontend或https://medium.com/@arcagarwal/same-site-changes-in-chrome-1c86973454f9阅读更多信息

【讨论】：

【解决方案2】：

我遇到了同样的问题，

您是否查看过 cookie 配置中的 domain 和 path 选项？

domain：表示 cookie 域的字符串（无默认值）。
path：表示cookie路径的字符串（默认为/）。

参考我的回答：https://stackoverflow.com/a/67341751/12408623

您在使用 CRA 吗？您的 MERN 应用程序是否存在于 Monorepo 中？

修复：

1.将 react 应用与服务器捆绑在一起。

const express = require('express');
const path = require('path');
const app = express();
const PORT = 9000;

// You'll need to path join to your react build directory
app.use(express.static(path.join(__dirname, 'build')));

app.get('/', function (req, res) {
  res.sendFile(path.join(__dirname, 'build', 'index.html'));
});

app.listen(PORT);

2.使用 JWT 维护基于令牌的会话。

我会说这种方法会更稳健。但是，JWT 并不是在所有情况下都理想，但在大多数情况下应该就足够了。

如果您有一个 monorepo MERN 代码库，您决定在其中使用 JWT。然后您可以在不同的域/平台中部署您的客户端和服务器。

查看我写的关于将子目录部署到 Heroku 的这篇博文

https://shrynk.jagankaartik.live/tSepqC1qKF

【讨论】：