Express生产环境下未向浏览器发送Cookie问题求助

本地运行MERN应用一切正常，部署后端后浏览器拿不到Cookie，核心原因基本是跨域场景下Cookie的传递规则和本地同源环境不一样，结合你的代码，给你几个必查的解决点：

1. 补全Cookie的跨域配置参数 #

你当前的Cookie设置缺少跨域相关属性，生产环境下必须补上：

• secure: true：部署后一般用HTTPS，只有开启这个属性，浏览器才会在HTTPS环境下接收Cookie
• sameSite: "none"：跨域场景下得设为none，允许跨站点传递Cookie
• domain：指定Cookie生效的域名，比如后端在api.yourdomain.com、前端在yourdomain.com，就设成.yourdomain.com（前面的点不能少，子域名也能共享）

修改后的代码：

res.cookie("token", "some value", {
    httpOnly: true,
    maxAge: 1000 * 60 * 60 * 24 * 20,
    secure: process.env.NODE_ENV === "production", // 生产环境开启，本地可关闭
    sameSite: process.env.NODE_ENV === "production" ? "none" : "lax",
    domain: process.env.NODE_ENV === "production" ? ".yourdomain.com" : undefined // 替换成你的实际域名
})

2. 后端CORS必须开启允许携带Cookie #

如果用Express的cors中间件，得配置两个关键参数：

• credentials: true：允许跨域请求携带Cookie
• origin：必须指定前端的实际域名，不能用*（*会和credentials属性冲突）

示例代码：

const cors = require('cors');
app.use(cors({
    origin: process.env.FRONTEND_URL, // 比如"https://your-frontend.com"
    credentials: true
}));

3. 前端请求要明确携带Cookie标识 #

不管用axios还是fetch，都得告诉浏览器要携带Cookie：

• axios写法：

axios.get('/api/your-endpoint', {
    withCredentials: true
});

• fetch写法：

fetch('/api/your-endpoint', {
    credentials: 'include'
});

4. 检查协议与域名匹配 #

• 生产环境必须前后端都是HTTPS，否则开启secure属性的Cookie会被浏览器拒收
• 后端设置的domain要和前端域名对应，别写错域名格式

内容的提问来源于stack exchange，提问作者qhamid