首页 > 其他分享 >CDN加速WordPress触发CORS导致跨域加载失败

CDN加速WordPress触发CORS导致跨域加载失败

时间:2023-04-28 12:33:07浏览次数:51  
标签:跨域 CDN org nginx 报错 CORS WordPress


这两天折腾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_16091571/6233830

相关文章

  • wordpress产品排序
    updatewp_postssetmenu_order=100wherepost_type='product';updatewp_postssetmenu_order=5wherepost_name='r-m-williams-craftsman-boot_792c678e';updatewp_postssetmenu_order=10wherepost_name='r-m-williams-rod-polo_ee292998......
  • phpstudy配置nginx跨域请问
    add_headerAccess-Control-Allow-Origin*; add_headerAccess-Control-Allow-Methods'GET,POST,OPTIONS'; add_headerAccess-Control-Allow-Headers'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Cont......
  • js -- 跨域问题
    js--跨域问题  前言出于浏览器同源策略的影响,浏览器会阻止一个域的js脚本和另一个域的内容进行交互,因此产生了跨域问题,该问题也经常在面试和开发中遇到,本文来总结一下相关知识点。正文1、什么是同源策略因为浏览器出于安全考虑,存在同源策略,就是说如果......
  • 发布Flash跨域策略,CORS跨域资源共享漏洞,设置访问白名单
    1      问题描述:跨域策略文件配置问题:<allow-access-fromdomain="*"/>,允许从任何域进行访问 2      解决方案:找到对应的文件,正确配置白名单,配置样例如下: ......
  • NET CORE 跨域问题
    在StartUp类里面配置如下代码即可解决跨域问题publicvoidConfigureServices(IServiceCollectionservices){services.AddCors(p=>p.AddPolicy("corsapp",builder=>{builder.WithOrigins("*").AllowAnyMethod().Allo......
  • 前端跨域解决方案——CORS
    CORS(跨来源资源共享)是一种用于解决跨域问题的方案。CORS(跨来源资源共享)是一种安全机制,用于在浏览器和服务器之间传递数据时,限制来自不同域名的请求。在前端开发中,当通过XMLHttpRequest(XHR)或FetchAPI发送跨域请求时,如果服务器没有正确配置CORS,浏览器会阻止该请求,从而导致请求......
  • 腾讯云CDN命令行自动上传
    最近这个项目的运营提供的是腾讯云的CDN,一开始使用起来不是特别方便,因为运营那边无法提供部分权限的子账号,只能自己研究下操作了。开始为了方便测试对接下载正常,使用了腾讯云专属的cosbrowser的Win端来说手动拖进去,然后测试桶路径下下载链接是否可以已正常进行。cosbrowser下载......
  • 本地图文直接复制到WordPress编辑器中
    ​ 在之前在工作中遇到在富文本编辑器中粘贴图片不能展示的问题,于是各种网上扒拉,终于找到解决方案,在这里感谢一下知乎中众大神以及TheViper。通过知乎提供的思路找到粘贴的原理,通过TheViper找到粘贴图片的方法。其原理为一下步骤:监听粘贴事件;【用于插入图片】获取光标位置;【......
  • 黑客利用WordPress 插件暗中建立后门网站
    东方联盟网络安全组织在上周发布的一份报告中透露,有人观察到威胁行为者利用一个合法但过时的WordPress插件暗中建立后门网站,作为正在进行的活动的一部分。有问题的插件是EvalPHP,由名为flashpixx的开发人员发布。它允许用户插入PHP代码页和WordPress网站的帖子,每次在网......
  • nginx解决Ajax跨域问题
    今天遇到一个ajax跨域问题,下拉框的数据源要从一个接口获得,但是该接口被部署到另外一台服务器上,在本地可以通过http请求访问,并可以返回json的数据,但是放到页面中不可以获取到下拉框的值,发现chrome控制台中该请求成功,但是没有返回值,于是便遇到了跨域的问题,请教一同事,问题得到解决:1.搭......