Netlify部署的Vite应用中Set-Cookie无法设置Cookie问题

针对你的Netlify前端 + Railway后端在Google OAuth重定向时Cookie设置失败的问题，以下是排查和解决步骤：

1. 确保CORS配置完全正确 #

跨域请求携带Cookie必须满足两个核心条件：

• 后端CORS需明确指定前端Origin（不能用*），并开启凭证支持：

const cors = require('cors');
app.use(cors({
  origin: 'https://typoio.netlify.app',
  credentials: true,
}));

• 前端请求必须携带凭证：
  • 使用fetch时：fetch('/api/xxx', { credentials: 'include' })
  • 使用axios时：axios.get('/api/xxx', { withCredentials: true })

2. 配置Express信任代理 #

Railway后端运行在反向代理环境中，Express默认无法识别真实请求协议（HTTPS），会导致secure: true的Cookie无法正确生效。添加以下代码修正：

app.set('trust proxy', 1);

3. 解决跨域名Cookie存储限制 #

你的前端（typoio.netlify.app）和后端（Railway分配的独立域名）属于不同顶级域名，浏览器出于安全限制，不会在前端域名下存储后端设置的Cookie。最可靠的解决方法是通过Netlify代理让前后端共享同一域名：
在项目根目录创建netlify.toml文件，添加重写规则：

[[redirects]]
  from = "/api/*"
  to = "https://你的Railway后端完整域名/:splat"
  status = 200
  force = true
  headers = { 
    "Access-Control-Allow-Origin" = "https://typoio.netlify.app", 
    "Access-Control-Allow-Credentials" = "true" 
  }

之后前端请求后端时，改用/api/xxx路径代替直接请求Railway域名，请求会通过Netlify代理转发，前后端处于同一域名下，Cookie即可正常存储。

4. 验证OAuth回调流程 #

确保Google OAuth的回调地址是后端的HTTPS地址，且后端处理完授权逻辑后重定向回前端时，Set-Cookie头已正确包含httpOnly: true、secure: true、sameSite: "none"这些属性。

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