Express.js+Axios部署问题：已启用withCredentials但Cookie无法设置

核心排查点及修复方案 #

1. 服务端登录接口必须正确配置Cookie属性

你目前只贴了基础中间件代码，但登录接口（/api/users/login）是设置Cookie的关键，必须在该接口中用res.cookie()设置Cookie时添加跨域HTTPS场景下的强制属性：

// 示例登录接口代码
app.post('/api/users/login', (req, res) => {
  // 用户验证逻辑...
  // 设置Cookie
  res.cookie('token', '你的认证令牌', {
    httpOnly: true, // 可选，提升安全性，防止XSS攻击
    secure: true, // 必须开启！客户端是HTTPS，浏览器会拒绝非secure的跨域Cookie
    sameSite: 'None', // 跨域场景必须设为None，否则现代浏览器会拦截Cookie
    maxAge: 24 * 60 * 60 * 1000, // Cookie有效期，按需调整
    domain: '.onrender.com' // 可选，需子域名共享Cookie时设置，否则留空自动匹配当前域名
  });
  res.status(200).send('登录成功');
});

重点：secure: true和sameSite: 'None'是跨域HTTPS环境下的硬性要求，缺一不可。

2. 客户端Axios配置冗余，需清理

Axios中只需设置withCredentials: true即可，credentials: 'include'是Fetch API的配置项，放在Axios里无效且可能引发冲突，修改客户端代码：

export const sendLoginRequest = createAsyncThunk("login", ({email, password}) => {
    return axios.post("https://butterflix.onrender.com/api/users/login", {
        email: email.value,
        password: password.value,
      }, { withCredentials: true }) // 仅保留这一项配置
      .then(() => {
        return axios.get("https://butterflix.onrender.com/api/users/me", { withCredentials: true }) // 同步清理冗余配置
            .then(res => res.data)
      })
})

3. 服务端额外检查项

• 避免多个CORS中间件冲突：不要在app.use(cors(...))之后再添加其他CORS相关配置，防止origin或credentials参数被覆盖。
• 确认服务器HTTPS正常：你的服务部署在Render上，默认支持HTTPS，这一点无需额外处理；若本地测试，需配置HTTPS代理。

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