Azure分开部署的React客户端无法设置http-only cookie问题求助

1. Set-Cookie响应头格式错误 #

你提供的响应头中Set-Cookie字段存在非法换行：过期时间属性的GMT被单独拆分到下一行，不符合HTTP响应头的格式规范，会直接导致Chrome等浏览器解析该字段失败，直接忽略Cookie写入操作。
你需要先修复后端响应头生成逻辑，确保Set-Cookie字段内容是连续的单行文本。

2. Cookie属性缺失/配置不符合跨站要求 #

你当前的Cookie仅配置了HttpOnly属性，缺少现代浏览器跨站Cookie写入必须的两个属性：

• Secure：要求Cookie仅通过HTTPS协议传输，Azure App Service默认使用HTTPS访问，缺少该属性会导致浏览器拒绝存储跨站Cookie
• SameSite=None：两个独立的Azure App Service属于不同域名的跨站场景，Cookie默认的SameSite=Lax规则会禁止第三方上下文写入和携带Cookie，必须显式设置为SameSite=None（该属性必须和Secure同时配置才会生效）

修复后符合要求的Set-Cookie格式参考：

Set-Cookie: {Cookie-Name}={JWT-Token}; expires=Fri, 29-Oct-2021 12:24:27 GMT; path=/; HttpOnly; Secure; SameSite=None

3. Azure公共后缀域名限制 #

azurewebsites.net属于Mozilla维护的公共后缀列表中的域名，浏览器不允许在该一级域名下设置跨子域名的Cookie。如果你的后端服务域名和客户端域名均为azurewebsites.net的二级域名（比如后端是xxx.azurewebsites.net，客户端是yyy.azurewebsites.net），Cookie默认会被绑定到后端服务的独立二级域名下，客户端域名的请求自然无法携带该Cookie。
该问题的解决方案有两种：

• 为前后端服务配置自定义的同一根域名，比如前端用app.yourdomain.com，后端用api.yourdomain.com，将Cookie的Domain属性设置为.yourdomain.com即可实现跨子域携带
• 显式在Set-Cookie中指定Domain为后端服务的完整二级域名，同时确认Apollo请求的目标地址完全匹配该域名

4. Azure App Service层面的CORS配置冲突 #

Azure App Service门户的「CORS」设置项优先级高于后端代码中配置的CORS规则，如果你在Azure门户中也配置了CORS规则，可能会覆盖后端返回的跨域头，甚至自动过滤Set-Cookie字段。
你需要检查Azure App Service的CORS配置，优先删除门户层面的CORS规则，完全由后端代码处理跨域逻辑即可。

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