解决网站启用七牛CDN后Font Awesome图标失效问题

前端时间由于网站访问速度不太理想便申请了七牛的账号,期望通过将网站的静态文件放到七牛的空间中去并启用CDN加速自己的网站,热情满满地设置好了全部之后查看网站前端闪现作用,结果发现自己网站运用的Font Awesome字体图标不见了,网站变丑了不说缩短符号也变成了“fl”字母,这严重影响了用户的体验作用。既然问题从前产生了,那么最好的措施就是处理它!

通过查看网站错误信息,发现原来是跨域央求失利,闪现的错误信息如下:

Font from origin \'http://qiniu.blog.quietguoguo.com\' has been blocked from loading by Cross-Origin Resource Sharing policy: No \'Access-Control-Allow-Origin\'      blog.quietguoguo.com/:1 header is present on the requested resource. Origin \'http://blog.quietguoguo.com\' is therefore not allowed access. The response had HTTP status code 403.

刚初步还不太置信,所以向七牛提交了工单,七牛那边给的回复是“应该是 blog.quietguoguo.com 这个域名的央求没有带 Access-Control-Allow-Origin 跨域头,七牛这边的响应是默许带跨域头的”既然如此那就改吧。可是自己关于跨域央求能够说是一窍不通,幸而从网上找到一款便当更改header的插件HTTP Headers,装置上试了一下,仍是提示上面的错误信息,心想是自己关于跨域央求的学问缺乏配置错了,所以又硬着头皮看了两天的官方文档,结果仍是不可,不用插件自己手动添加也不可,这可把我急坏了。今日闲着无聊又看了下七牛那边的设置,结果发现原来是自己敞开了防盗链设置,还没有将qiniu.blog.quietguoguo.com参加到白名单中去!!!从头设置好后Font Awesome字体图标回来了!原以为是跨域头没设置好,原来问题如此简单,期望遇到相同问题的同窗不要像我一样走这么多弯路了。

注:我运用的是WP Super Cache这款插件供给的CDN功用联接的七牛,猜测问题的缘由应当是网站通过新的URL:http://qiniu.blog.quietguoguo.com提取我存储在七牛上的静态资源,而由于我敞开了防盗链,这个域名又没在白名单中,所以七牛回绝供给资源所招致的。