Question

在CDN上托管FontAwesome时，如果该CDN的域与您的服务器域不匹配，如何允许它加载字体？

我的媒体托管在一个S3存储桶中，由Cloudfront端点提供服务。我的网页由example.com提供，包含指向此Cloudfront端点的链接，并且此端点的所有初始媒体请求都已成功。但是，如果我触发任何尝试呈现新FontAwesome内容的JS，导致它尝试加载字体，我会收到如下错误：

Access to Font at 'http://lkfejwifisj.cloudfront.net/font-awesome-4.2.0/fonts/fontawesome-webfont.d95d6f5d5ab7.woff?v=4.2.0' from origin 'http://example.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://example.com' is therefore not allowed access.

我通过配置使我的S3存储桶的CORS策略尽可能开放：

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

然而，这并没有解决问题。

我正在使用Chrome作为我的浏览器，显然此类错误之前曾提到过many many次。但是，所提出的解决方案都不适用，或者对我不起作用。

我该如何解决这个问题？

当我明确允许我的CORS配置中的所有来源时，为什么Chrome会在所请求的资源上显示“No'Access-Control-Allow-Origin'标头”？

Answer 1

原来我的CORSConfiguration是正确的，实际上修复了问题，但是我的浏览器正在缓存旧请求，所以我仍然看到同样的错误。

如果我在隐身浏览器中加载页面，确保我的缓存已清除，我就不会收到错误。

如何允许FontAwesome从其他域

1 个答案: