Font-Awesome字体跨域无法正常显示的问题解决

网页使用 Font Awesome 字体图标时图标不能正常显示，浏览器控制台出现“@font-face 跨源请求失败。资源访问受限”的错误提示，出现该错误的原因是浏览器的同源策略机制导致。解决方法是使用跨域资源共享（CORS）机制，跨域资源共享标准新增了一组 HTTP 首部字段，允许服务器声明哪些源站有权限访问哪些资源。

Nginx下Font-Awesome字体跨域无法正常显示的问题解决

在nginx的配置文件下新增

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

新增后重启nginx直接就可以解决了。

apache 服务器可以通过 .htaccess 文件添加：

<FilesMatch ".(eot|ttf|svg|woff)">Header set Access-Control-Allow-Origin "*" #表示允许所有的源来访问资源，也可已指定域名，如 www.yuucn.comHeader set Access-Control-Allow-Methods "*" #允许请求的方法 GET POST等