跨子域名Cookie设置失败求助：前后端分属同一主域不同子域

针对同一主域下前后端子域跨域无法获取Cookie的问题，从以下几个关键点逐一排查：

• SameSite 属性必须配置为 None
  现代浏览器默认 SameSite=Lax，跨子域的AJAX请求（如fetch/axios）会被限制携带Cookie。必须显式设置 sameSite: 'None'，且该属性强制要求配合 secure: true（仅HTTPS环境生效）。正确配置示例：

  res.cookie('myCookie', 'myValue', {
    domain: '.example.com',
    path: '/',
    secure: true,
    sameSite: 'None',
    httpOnly: false // 若前端需通过document.cookie读取，必须设为false；仅需请求携带则可设为true
  });
  

• 验证HTTPS环境与secure属性匹配
  如果你的服务还在HTTP环境（比如本地开发），设置 secure: true 会导致浏览器直接丢弃Cookie。本地调试时可暂时将 secure 设为 false，但生产环境必须开启HTTPS并保持 secure: true。

• 前端请求必须携带凭证
  前端发送请求时，必须明确告知浏览器携带Cookie：

  • 使用fetch时：fetch(url, { credentials: 'include' })
  • 使用axios时：axios.get(url, { withCredentials: true })
    没配置的话，即使后端正确设置了Cookie，前端也无法接收或携带。

• 检查主域格式与拼写

  • 确保 domain 参数是正确的主域前缀格式，比如主域是 example.com 则写 .example.com，若主域是 example.co.uk 则必须写 .example.co.uk（不能只写 .co.uk）。
  • 避免拼写错误，多/少写点号、域名写错都会导致Cookie绑定到错误域名。

• 直接检查浏览器Cookie存储
  打开浏览器开发者工具→Application（Chrome）→Cookies，查看对应主域下是否存在目标Cookie：

  • 若Cookie不存在：说明后端配置仍有问题，回头检查上述参数。
  • 若Cookie存在但前端无法读取：检查是否设置了 httpOnly: true（该属性会禁止JS读取Cookie，仅HTTP请求可携带）。

• 浏览器第三方Cookie限制
  Safari等浏览器默认限制第三方Cookie，即使是同一主域的子域也可能被判定为第三方。这种情况可：

  • 调整浏览器隐私设置（仅调试用）；
  • 改用Token存储到localStorage（注意XSS风险）；
  • 确保Cookie的 SameSite: None 和 secure: true 配置正确，部分浏览器对符合该条件的Cookie会放宽限制。

内容的提问来源于stack exchange，提问作者Amir hossein Hassani