本地fetch可设置同域Cookie，部署后失效求助

核心问题出在跨子域的凭证处理和Cookie的跨域共享配置上：

• 本地运行时，SPA和API大概率是同域名（比如都是localhost:xxx），属于同源，credentials: "same-origin"能正常工作；
• 远程环境中，SPA在my-build.mywebsite.org.uk，API在identity-build.mywebsite.org.uk，属于同主域的不同子域，不属于同源，same-origin会阻止浏览器处理跨源的Cookie。

具体修复步骤 #

1. 修改fetch的credentials选项 #

把credentials: "same-origin"改为credentials: "include"，这样浏览器会在跨源请求时携带凭证，同时接受跨源响应中的Set-Cookie头：

fetch(url, {
  method: "POST",
  credentials: "include", // 替换原来的same-origin
  headers:{
    'Content-Type': 'application/x-www-form-urlencoded'
  },    
  body: formData
})

2. 调整API的Set-Cookie头配置 #

API返回的Set-Cookie必须添加以下关键属性：

• Domain=.mywebsite.org.uk：指定Cookie的主域，让所有子域（包括my-build和identity-build）都能访问该Cookie；
• Path=/：确保Cookie在整个域名下有效；
• 如果是HTTPS环境，必须加上Secure：强制Cookie只能通过HTTPS传输；
• 若存在跨域POST场景，需设置SameSite=None（配合Secure使用），避免浏览器的SameSite策略阻止Cookie发送。

示例Set-Cookie头：

Set-Cookie: mywebsite-identity=xxx; Domain=.mywebsite.org.uk; Path=/; Secure; SameSite=None

3. 确保API的CORS配置正确 #

API服务器必须返回以下CORS响应头：

• Access-Control-Allow-Credentials: true：允许跨源请求携带凭证；
• Access-Control-Allow-Origin: https://my-build.mywebsite.org.uk：必须明确指定SPA的域名，不能用*（带凭证的CORS请求不支持通配符Origin）。

验证要点 #

• 登录请求完成后，在浏览器开发者工具的「Application」→「Cookies」中，检查identity-build.mywebsite.org.uk下是否存在mywebsite-identityCookie，且Domain属性为.mywebsite.org.uk；
• 回调请求时，查看请求头是否携带了该Cookie。

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