这两天折腾CDN加速来提升自己博客的访问速度,用的阿里云CDN加速方案;使用的时候发现一个问题,部分资源CDN加速失败,原因是触发了CORS,因为CDN加速网址与博客网址不一致引发的跨域请求不成功;
从报错中发现Off与Tff字体加载报错:
(index):1 Access to Font at 'http://cdn.5yun.org/wp-content/themes/yusi1.0/fonts/fontawesome-webfont.woff?v=4.1.0' from origin 'http://www.5yun.org' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.5yun.org' is therefore not allowed access.
既然报错,那就先了解一下CORS的原理:
CORS定义一种跨域访问的机制,可以让AJAX实现跨域访问。CORS 允许一个域上的网络应用向另一个域提交跨域 AJAX 请求。实现此功能非常简单,只需由服务器发送一个响应标头即可。
WordPress触发CORS导致跨域加载失败的解决办法:
目前我用的是lnmp控制面板,对应站点的nginx配置文件在/usr/local/nginx/conf/vhost目录下
编辑www.5yun.org.conf当前站点配置文件,在合适位置加入以下代码
location ~* \.(ttf|woff)$ { add_header Access-Control-Allow-Origin *; }
配置保存完毕后,需要重启nginx服务器才能生效
/etc/init.d/nginx restart
然后ctrl+f5强制刷新一下,ttf与woff跨域加载报错的问题就消失了;
标签:跨域,CDN,org,nginx,报错,CORS,WordPress From: https://blog.51cto.com/u_13991401/5884923