Rails API+NextJS跨域场景下Set-Cookie不生效无法读取问题求助

DevOps 小满

2026-10-4

解决方案步骤

1. 修正NextJS侧fetch请求配置

跨域请求需要携带/接收凭证时，credentials参数必须设置为include，你之前用的same-origin仅在同域请求时生效，完全不匹配跨域场景：

return fetch(`${PublicApiUrl}/auth/login.json?${qs.stringify(options)}`, {
  method: 'POST',
  headers: {
    Accept: 'application/json',
    'Content-Type': 'application/json',
  },
  credentials: 'include' // 替换原有配置，仅需这一个值即可
})

注意：前端JS永远无法读取httpOnly属性的Cookie，也无法通过fetch API拿到Set-Cookie响应头，这是浏览器的安全限制，和你的配置无关，不需要再尝试打印这两个值做调试。

2. 修正Rails侧Cookie设置逻辑

Cookie的domain属性不支持携带端口，你当前设置的localhost:5000属于非法值，浏览器会直接丢弃该Cookie：

response.set_cookie(
  "withIP",
  {
    value: auth_token[:token],
    expires: 30.minutes.from_now,
    path: "/",
    domain: "localhost", // 只写域名，不要带端口，开发环境直接填localhost即可
    secure: Rails.env.production?,
    httponly: true
  }
)

3. 检查Cookie的存储位置

该Cookie是Rails服务（端口3000）写入的，属于http://localhost:3000域下的资源，你需要在Chrome开发者工具的Application -> Storage -> Cookies -> http://localhost:3000路径下查看，不要找5000端口的Cookie列表。