网页使用 Font Awesome 字体图标时图标不能正常显示，浏览器控制台出现“@font-face 跨源请求失败。资源访问受限”的错误提示，出现该错误的原因是浏览器的同源策略机制导致。解决方法是使用跨域资源共享（CORS）机制，跨域资源共享标准新增了一组 HTTP 首部字段，允许服务器声明哪些源站有权限访问哪些资源。
apache 服务器可以通过
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等
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
评论(0)