您如何访问 CloudFront 分发后的静态 S3 站点上的 cookie?

How can you access cookies on a static S3 site behind a CloudFront distribution?

所以我正在尝试部署我的网站,它在本地环境中运行良好,但是当它部署到 Cloudfront 时,它似乎无法访问 cookie。

我的前端技术栈如下:Angular 站点托管在 S3 上,前端分布在它前面,自定义域名具有有效的 ssl 证书。

当用户导航到登录页面时,他们可以成功提交论坛,并且服务器在 Set-Cookie header.

中响应一个 JWT 令牌

不过在此之后,在 angular 站点中它表示 access-token cookie 不存在。这里奇怪的是,在后续请求中,access-token cookie 实际上被转发回后端。 (在下图中,再次按下登录按钮,因此响应 cookie 与请求 cookie 相同。)

我已确保未设置 HttpOnly,并且前端和后端都托管在同一根域下 frontend.root.comapi.root.com.

Cloudfront 已配置为转发 access-token cookie:

缓存策略

源请求策略(请注意,当我将此设置为转发所有 cookie 而不仅仅是访问令牌时,它仍然不起作用):

响应header设置

所以在我的 angular 站点中,在 /login api 调用解决后,我使用 ngx-cookie-service 检查并尝试检索 cookie。

this.cookieService.check('access-token'); // checks if it exists, returns false
this.cookieService.get('access-token'); // returns '' meaning the cookie does not exist

关于如何解决此问题并从我的 angular 站点访问 cookie 的任何想法?如果需要,我可以提供有关我的配置的更多信息。谢谢!

正如您在屏幕截图中几乎看不出的那样,Cookie 将域设置为以 a 开头的内容,这表明它是 api.root.com,最重要的是它不是 frontend.root.com 并且不是 root.com.

服务器需要将 cookie 的域设置为 root.com 以便它的所有子域都可用。