http-headers - 字体上的 Amazon CloudFront 跨域 header

Question

我有一个 CloudFront 发行版，它会阻止 Chrome(桌面版)中的字体下载，并出现以下错误:

Font from origin 'https://....cloudfront.net' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://example.com' is therefore not allowed access.

我应该在哪里设置这个 Access-Control-Allow-Origin header ？

我尝试在 can 分发的“Origin”部分添加标题，但它不会产生任何效果。



编辑#1:

源上的 Nginx 配置具有以下指令:

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

在这个测试中 curl -I https://example.com/skin/frontend/smartwave/default/megamenu/css/fonts/fontawesome-webfont.woff
恢复休闲响应:

HTTP/1.1 200 OK
Server: nginx
Date: Tue, 02 Feb 2016 17:53:39 GMT
Content-Type: application/font-woff
Content-Length: 44432
Last-Modified: Wed, 13 May 2015 15:58:11 GMT
Connection: keep-alive
ETag: "55537493-ad90"
Pragma: public
Cache-Control: max-age=31536000, public, must-revalidate, proxy-revalidate
Accept-Ranges: bytes

从我在这里看到的标题 Access-Control-Allow-Origin不见了。

此外，我将 CloudFront 上的 header 列入白名单，这样它就不会阻止它:

Answer 1

这很难追踪，因为标题的规则设置在 2 个不同的位置而不是一个位置。

为正确的文件类型修复正确的标题就可以了，但是 你必须考虑事实上，在某些地方 试图覆盖 NGINX 规则不起作用 .它只会考虑第一条规则。

可以在此处找到对 header 的全面描述 https://stackoverflow.com/a/10636765/1168944