Question

我已经下载了font-awesome 4.5.0并加载了我自己的cdn（cachefly）。然后根据font-awesome的建议，我使用了css文件的链接，如：

<link rel="stylesheet" href="http://mycachefly.cachefly.net/external/font-awesome/4.5.0/css/font-awesome.min.css">

但是，我收到以下错误：

Font from origin 'http://wisa.cachefly.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 'http://localhost' is 
therefore not allowed access.

这里有什么问题？

ps：我没有.htaccess文件。它是一个来自extjs和angular

的混合项目

Answer 1

这种情况正在发生，因为您没有启用CORS，允许从您的来源以外的其他域加载资源。某些服务默认启用CORS，例如fontawesomecdn。

在本页底部还有一个解释，无论您使用的是Apache还是Nginx，都可以在源服务器上启用CORS。

Apache - 放在.htaccess文件中

<IfModule mod_headers.c>
<FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css|css|js|gif|png|jpe?g|svg|svgz|ico|webp)$">
    Header set Access-Control-Allow-Origin "*"
</FilesMatch>

Nginx - 放在nginx.conf文件中

location ~ \.(ttf|ttc|otf|eot|woff|font.css|css|js|gif|png|jpe?g|svg|svgz|ico|webp)$ {
add_header Access-Control-Allow-Origin "*";
}

在我自己的cdn上字体很棒

1 个答案: