为什么Node.js服务端可向Postman发送Cookie但本地React应用接收不到

这个问题属于跨域请求下Cookie传递的典型配置缺失，Postman默认不限制跨域Cookie所以运行正常，浏览器遵循同源策略需要做两处配置修改：

1. 调整Node.js后端配置 #

修改CORS配置 #

原有默认CORS配置不允许跨域携带凭证，替换app.use(cors())为以下代码：

app.use(cors({
  // 填写前端实际运行地址，本地开发一般是http://localhost:前端端口，生产环境替换为正式前端域名
  origin: "http://localhost:3001", 
  credentials: true // 允许跨域请求携带Cookie
}));

注意：origin参数不能使用通配符*，否则credentials配置会失效。

调整Cookie配置（可选，适配不同环境） #

本地开发环境为http协议时，不要开启secure: true，该配置要求Cookie仅能在https协议下传输，http环境开启会导致Cookie被浏览器直接拒收。生产环境如果前后端跨域部署，还需要补充sameSite: none配置：

if (process.env.NODE_ENV === "production") {
  cookieOptions.secure = true;
  cookieOptions.sameSite = "none";
}

2. 调整React前端axios请求配置 #

axios默认不会在跨域请求中携带Cookie，需要在请求参数中新增withCredentials: true：

axios({ 
  method: "POST", 
  url: url, 
  data: data, 
  headers: header,
  withCredentials: true // 新增该行配置
})

如果有全局axios实例，也可以统一配置：

axios.defaults.withCredentials = true;

修改完成后重启前后端服务即可生效，可通过浏览器开发者工具「Application」面板的Cookie栏目验证jwt Cookie是否正常写入。

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