没有 S3 存储桶的 AWS Cloudfront CORS 标头

Posted 2023-03-27

【中文标题】没有 S3 存储桶的 AWS Cloudfront CORS 标头

【英文标题】：AWS Cloudfront CORS headers without S3 bucket

【发布时间】：2019-11-17 02:40:38

【问题描述】：

我正在使用 CloudFront CDN 以“Origin Pull”模式简单地缓存我的静态内容。 CloudFront 源是我的网站。

但是，我遇到了 CORS 问题。我的浏览器不允许我的网页从 CloudFront 加载我的字体文件和 SVG。

在谷歌上搜索了一下这个问题后，我注意到所有博客/教程都解释了如何在用作 CloudFront 源的 S3 存储桶上启用 CORS，并让 CloudFront 将 Access-Control-Allow-XXX 标头从 S3 转发到客户。

我不需要 S3 存储桶，如果可能的话，为了简单起见，我希望保持这种状态。

是否可以在 CloudFront 上启用 CORS？即使是快速而肮脏的解决方案，例如在所有响应上设置访问控制标头也足够了。

【问题讨论】：

绝对不需要 S3 存储桶，您可以使用多种不同的方法...但首先，您的源服务器作为其面向 Internet 的 Web 服务器运行的是什么？ nginx？阿帕奇？还有什么？这是您可以访问的东西还是完全超出您的控制范围？

@Michael-sqlbot - 我面向 Internet 的 Web 服务器是一个 IIS，前面有一个 nginx 负载平衡器。

【参考方案1】：

根据上面的评论，CORS 是从与 TO 域不同的域发出的请求。避免这种情况的关键部分是在返回您的请求的服务器中返回允许跨源请求的标头。

您的字体应该是您网站的资产，应该与您的网站保存在同一台服务器中，因此 CORS 应该不是问题。

【讨论】：

问题是我的字体和 SVG 在 CDN 网络上（通过 URL cdn.MyWebsite.com 访问），因此我的浏览器阻止了内容。

这就是您的云端的用途。将您的 cdn 域添加为另一个云端源并在您的应用程序中映射路径。如果您不确定如何，请添加评论，我将使用步骤编辑我的答案。

我不确定将 CDN 域添加为来源有何意义。来源不是应该从中获取数据的网站吗？

请查看：aws.amazon.com/premiumsupport/knowledge-center/…

该页面似乎解释了如何设置使用 S3 处理静态内容。我不想用那个。我希望 Cloudfront 只提供静态内容，因此我可以在我的网站上使用 CDN.MyWebsite.com/img/img.jpg 之类的链接，其中 CDN.MyWebSite.com 是我的 Cloudfront URL 的 CNAME。