`
1028826685
  • 浏览: 938490 次
  • 性别: Icon_minigender_1
  • 来自: 重庆
社区版块
存档分类

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

    博客分类:
  • Web
 
阅读更多

这两天折腾CDN加速来提升自己博客的访问速度,用的阿里云CDN加速方案;使用的时候发现一个问题,部分资源CDN加速失败,原因是触发了CORS,因为CDN加速网址与博客网址不一致引发的跨域请求不成功;

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

从报错中发现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跨域加载报错的问题就消失了;

 

分享到:
评论

相关推荐

    pdfjs 跨域预览文件(完整版t)

    PDF.js 是一个由 Mozilla 维护的...通过深入理解这些知识点并结合提供的“pdfjs跨域加载资料”,你应该能够成功实现在你的 Web 应用中跨域预览 PDF 文件。在实际开发中,根据具体需求进行调整和优化,以达到最佳效果。

    CDN加速服务软件

    是不是我们的免费CDN加速服务软件搭建非常简单,千万不要说免费的不好,20万连接并发没有哪家愿意免费给,我们的真正免费20万并发。 如果遇到问题可以随时联系我的QQ:281061456 如果不在线的话可以加交流群:...

    使用CDN和AJAX加速WordPress中jQuery的加载

    使用内容分发网络(CDN)和异步JavaScript与XML(AJAX)技术可以有效地加速WordPress网站中jQuery库的加载速度。以下是详细知识点的阐述: 首先,CDN是一种通过互联网分发服务的技术,它可以将数据(如文件、图片、...

    阿里云CDN加速配置

    以下是对阿里云CDN加速配置的详细说明: 一、基于源站域名加速 1. Nginx配置说明: 在Nginx服务器上,配置两个location,分别处理主域名`huodong.tongxinghui.com`和子路径`/huodong`。`proxy_pass`指令将请求转发...

    开源CDN加速管理工具OpenCDN.zip

    OpenCDN是一套快速部署CDN加速的工具,针对专门提供CDN加速服务的企业或对多节点CDN加速有需求的企业,提供一套便捷的CDN加速管理平台,可对每一个节点的状态、系统负载进行实时监测与统一管理,同时我们预制了多套...

    零成本搭建个人博客之图床和cdn加速.doc

    "零成本搭建个人博客之图床和cdn加速" 在本篇文章中,我们将探讨如何零成本搭建个人博客之图床和CDN加速。图床是一个非常重要的组件,它可以帮助我们解决文章中的图片资源问题。下面我们将详细介绍图床的优缺点、...

    pdfjs跨域展示远程pdf文件

    在处理跨域问题时,由于同源策略的限制,直接加载远程PDF可能会遇到问题。本篇文章将详细介绍如何利用PDFJS和SpringBoot构建一个能够跨域展示远程PDF文件的服务。 首先,理解“跨域”(Cross-Origin)的概念至关...

    WordPress腾讯云对象存储COS插件支持数据库定时备份、附件实时同步到COS、网站静态资源CDN加速等功能

    WordPress腾讯云对象存储COS插件支持数据库定时备份、附件实时同步到COS、网站静态资源CDN加速等功能。支持手动、定时任务自动备份数据库,保留30个备份版本;附件实时同步到腾讯COS,支持初始化同步将安装插件前已...

    wordpress 加速插件

    "WordPress加速插件"正是为了提升网站加载速度而设计的工具,它们通过各种技术手段来优化网站性能,包括缓存、CDN整合、图片优化、减少HTTP请求等。下面我们将深入探讨这些知识点: 一、缓存技术 缓存技术是加速...

    08 腾讯云CDN加速产品介绍

    腾讯云CDN加速产品介绍 CDN(Content Delivery Network)是一种将内容分布式部署在多个edge server上,以加速内容的访问和分发的技术。腾讯云CDN加速产品是基于CDN技术的云计算服务,旨在帮助用户快速、可靠地分发...

    CDN是什么 CDN加速有什么用?.docx

    CDN是什么 CDN加速有什么用?.docx

    一款内容分发网络CDN加速介绍单页源码源码资源下载整理.zip

    【内容分发网络CDN加速】是互联网技术中的一种重要机制,它的全称为Content Delivery Network。CDN的主要目的是通过在全球范围内的多个服务器节点上缓存网站内容,来提高用户访问速度,降低网络延迟,增强网站的可用...

    CDN加速技术详解.zip

    CDN(Content Delivery Network)加速技术是互联网领域中一种重要的技术,它通过在全球或区域内部署分布式边缘节点,将网站内容缓存到离用户最近的服务器上,以减少数据传输的延迟,提高用户访问速度和网站的可用性...

    it618视频直播学院 OSS私有后CDN回源加速与鉴权访问的设置方法1

    同时,为了视频播放的顺利进行,必须在CDN域名管理中设置跨域策略,允许指定来源的请求访问。 最后,CDN域名需要配置CNAME记录,将CDN二级域名指向OSS,否则会提示需要设置CNAME。完成这一步后,插件设置就大功告成...

    CDN:CDN加速器

    CDN CDN加速器使用方法: : 例如: //加载图片注意:版本号不是必需的,是为了区分新旧资源,如果不使用版本号,将会直接引用最新资源,另外还可以使用某个范围内的版本,请查看所有资源等,具体使用方法如下: //...

    JS跨域访问解决方案总结

    8. **CDN跨域**:使用CDN(Content Delivery Network)服务时,由于静态资源可能存储在多个不同的服务器上,因此CDN服务通常会处理跨域问题,确保资源可以被正确加载。 9. **Service Worker的跨域策略**:Service ...

    负载均衡与CDN加速资料

    负载均衡与CDN加速资料下载,记得打开密码是fwg 不要因为架构阻碍了网站的发展 http://www.mdcsoft.cn

    一个 Chrome 插件:将 Google CDN 替换为国内的.zip

    然而,对于中国用户而言,如果不能访问 Google CDN,这可能导致页面加载缓慢或不完整。因此,此插件的实现主要涉及以下几个关键知识点: 1. **JavaScript 框架和库的 CDN 加载**:理解如何在网页中使用 `<script>` ...

    Linux运维-运维课程MP4频-03阿里云-06-CDN-01CDN加速器介绍.mp4

    Linux运维-运维课程MP4频-03阿里云-06-CDN-01CDN加速器介绍.mp4

Global site tag (gtag.js) - Google Analytics