Cors 在Cloudfront缓存对象上设置访问控制允许原点

由于“”问题，Firefox中通过Cloudfront提供的字体已损坏。要解决这个问题，我知道我需要将“Access Control Allow Origin”头设置为通配符或源域

我遇到的问题是Cloudfront似乎不接受来自源站的标题

例如，以下是我为字体ping服务器时得到的标题列表：

curl -I -s "https://mysite.com/wp-content/themes/my-theme/includes/fonts/ProximaNova-Reg-webfont.ttf"
HTTP/1.1 200 OK
Server: nginx
Date: Wed, 29 Jan 2014 16:03:03 GMT
Content-Type: application/x-font-ttf
Content-Length: 44992
Last-Modified: Tue, 28 Jan 2014 22:21:41 GMT
Connection: keep-alive
ETag: "52e82d75-afc0"
Expires: Thu, 29 Jan 2015 16:03:03 GMT
Cache-Control: max-age=31536000
Access-Control-Allow-Origin: https://mysite.com
Access-Control-Allow-Methods: GET
Access-Control-Max-Age: 3600
Accept-Ranges: bytes

有了这个反应，一切看起来都很好；但是，当我为同一资源ping Cloudfront时，我得到：

curl -I -s "https://ds6dj5kp03o39.cloudfront.net/wp-content/themes/my-theme/includes/fonts/ProximaNova-Reg-webfont.ttf"
HTTP/1.1 200 OK
Content-Type: text/plain
Content-Length: 44992
Connection: keep-alive
Date: Wed, 29 Jan 2014 16:22:30 GMT
Server: Apache/2.2.16 (Debian) mod_ssl/2.2.16 OpenSSL/0.9.8o
Last-Modified: Wed, 22 Jan 2014 02:44:45 GMT
ETag: "5d633-afc0-4f0861b87a140"
Accept-Ranges: bytes
Cache-Control: max-age=3600
Expires: Wed, 29 Jan 2014 17:22:30 GMT
X-Cache: Miss from cloudfront
Via: 1.1 850e11212c3f83bfb138469e9b3b7718.cloudfront.net (CloudFront)
X-Amz-Cf-Id: M4qkj9FwjdAUW91U4WeZzxEI0m7vOmiQvryS55WwoeU5Ks11IC71ig==

似乎所有的源标题都被完全忽略了。我的问题是，如何让Cloudfront接受我的资产头，特别是关键的“访问控制允许原始”头

---

谢谢你的帮助

您所做的是正确的，但是CloudFront会缓存结果，因此您得到的是旧的缓存版本。 您可以在标题中看到这一点： 从您的站点：

最后修改：2014年1月28日星期二22:21:41 GMT

从云端：

最后修改：2014年1月22日星期三02:44:45 GMT

现在，如何让它重新工作：

a） 等待对象过期，然后再次请求它。CloudFront将在那时更新它

b） 使用amazon aws控制台>cloudfront>分发>无效化使对象无效。有关如何使用此选项的详细信息，请参阅

---

c） 更改名称或开始使用文件的版本名称，例如ProximaNova-Reg-webfont_2.ttf

如果您稍后会遇到此问题，并且自定义源文件已经正确地服务于访问控制允许源文件头，那么我检查/尝试了两件事：

检查您的nginx或apache配置是否有引号中的*，如果有的话 如果没有，请尝试删除它们

确保你通过了正确的考试 woff和ttf文件的内容类型。这是我找到的最快的链接 关于这个问题-

Apache

要为字体文件设置正确的mime类型，请将以下行添加到配置：

AddType application/vnd.ms-fontobject    .eot
AddType application/x-font-ttf           .ttf
AddType application/font-woff            .woff

如果您无法编辑配置，请在文件夹中使用 在那里投影并添加行

对于CORS标题，添加以下代码：

<FilesMatch ".(eot|ttf|otf|woff)">
  Header set Access-Control-Allow-Origin "*"
</FilesMatch>

对于CORS标题，将类似于此的内容添加到vhost配置中

location ~* \.(eot|ttf|woff)$ {
    add_header Access-Control-Allow-Origin *;
}

---

您的bucket有一个显式配置，用于动态评估CoRS头

见

这也是它们用途的一个重要方面

---

尝试为CF或S3设置CORS标头或其他内容将被放弃，因为这将破坏其缓存模型。

在默认配置中，CloudFront不检查标头或缓存其值。对您来说，一个可能的罪魁祸首是您的资源第一次被请求时没有“Origin”头，因此S3没有响应CORS头。响应被缓存，当您稍后发出跨源请求时，缓存的响应将在没有它们的情况下提供

---

您可以将CloudFront配置为将源报头转发到S3，并为不同的报头值缓存不同的响应，这将导致CloudFront在需要时缓存CORS报头。请参阅。

嘿，我仍然不明白链接问题的答案是：在服务器上设置标题。我的想法是，您必须在连接到的服务器上设置头。很好，人们不能否决评论，因为我在这里一定是个十足的白痴。是的……这可能也是我的问题；）我认为应该发生的是，您在服务器上设置的一些头被CloudFront持久化。它们显然会覆盖其中一些，但我认为它们会坚持其中一些。很多人都写过关于这种方法的文章，但它不适合我。也许这个假设是完全错误的。这行得通吗：？我在这个问题上发疯了。S3将Access Control Allow Origin标头设置为*并且通过cloudfront请求未设置该标头。读了这篇文章后，我上传了一个新文件，它的标题现在设置为：）有意义。非常感谢。

location ~* \.(eot|ttf|woff)$ {
    add_header Access-Control-Allow-Origin *;
}