2

我想从 CDN 加载 Fontawesome 但我得到了

failed cross-origin request. Resource access is restricted

我知道要解决这个问题，应该添加一个 HTTP 标头，但是有什么方法可以避免这样做吗？

我尝试用 '../font/fontawesome-webfont.eot?v=3.2.0') 完整的网址替换，但由于某种原因它没有帮助。没有标题有什么可以做的吗？

4

4 回答 4

3

您必须.htaccess使用此文本在字体文件夹上创建文件。

<FilesMatch ".(eot|ttf|svg|otf|woff|woff2)">
  Header set Access-Control-Allow-Origin "*"
</FilesMatch>
于 2017-02-20T17:09:51.073 回答
1

这是浏览器的同源策略限制http://www.w3.org/TR/css3-fonts/#same-origin-restriction。

如果您使用的是 amazon s3，这可以帮助您加载 Amazon S3 CORS（跨域资源共享）和 Firefox 跨域字体加载

于 2013-11-07T10:47:45.183 回答
1

您的 CDN 需要Access-Control-Allow-Origin:*在字体文件的响应中包含标头。请参阅我对 Chrome 中未显示的 Font Awesome 图标的回答，这是与 MaxCDN 相关的跨域资源共享策略问题

于 2014-10-15T23:38:34.800 回答
0

CORS 配置

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
      <AllowedOrigin>http://www.your-site.com</AllowedOrigin>
       <AllowedOrigin>https://www.your-site.com</AllowedOrigin>
       <AllowedMethod>GET</AllowedMethod>
       <AllowedMethod>HEAD</AllowedMethod>
       <AllowedMethod>DELETE</AllowedMethod>
       <AllowedMethod>PUT</AllowedMethod>
       <AllowedMethod>POST</AllowedMethod>
     </CORSRule>
</CORSConfiguration>
于 2017-10-03T07:17:14.820 回答