解决使用CDN后无法加载TTF字体文件-动静分离网站加速

    为了进一步提升站点的访问速度,同时不想在主域名上使用cdn,那么就只能对网站的静态资源下手了,嗯~ o(* ̄▽ ̄*)o没错,就是动静分离,不过这次的只能说小分离o_o
    在腾讯云上开通了cdn,专门解析了一个域名做静态资源加速,js、css啥的都放置好了,更改php头文件,也生效了,但奇怪的是网站部分图标没有显示出来,如下图:
f.jpg
    立即打开F12查看,发现ttf字体文件没有加载进来,如下图:
a.jpg

显示failed,随后又看了一下具体的报错:
b.jpg
英语不好,所以头有点大,此处用在线翻译查看一下:
Access to font at 'http://cdn.xuboke.cn/fonts/fontawesome-webfont.woff2' from origin 'http://www.xuboke.cn' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
有道翻译过后:
访问字体在'http://cdn.xuboke.cn/fonts/fontawesome-webfont.woff2'从来源'http://www.xuboke.cn'已被CORS的政策封锁:没有'访问控制-允许来源'头在请求的资源。
咳咳,这下就看得懂了,能猜出大概意思,就是没有header”头“放行,不允许从源站点加载cdn的字体文件,知道问题出在哪了,我们再去cdn控制台,添加一下HttpHeader参数,如下两点:
Access-Control-Allow-Origin : *
accept : */*
Access-Control-Allow-Origin参数是控制我们的访问允许来源,
accept参数是接收限制,我们都设置成如下图的样子就行了:
d.jpg
最后我们刷新一下cdn节点缓存(此处可能需要2-3分钟生效时间),然后回到我们的浏览器,刷新之后发现字体文件正常加载,图标也显示正常,网页加载速度也得到提升,如图:
g.jpg
到这里,关于cdn无法加载字体文件的问题就已经解决了,有任何问题欢迎在文章下留言哦。
作者:徐先森 文章名: 《解决使用CDN后无法加载TTF字体文件-动静分离网站加速》
收录情况: 百度已收录
版权说明:若无特别注明,本文皆为 "徐博客”原创,转载请保留出处!

相关推荐

发表评论

路人甲
看不清楚?点图切换 Ctrl+Enter快速提交

网友评论(8)

Nizagara Tablets Reviews  <a href=https://abcialisnews.com/#>Cialis</a> Propecia Minoxidil Together  <a href=https://abcialisnews.com/#>buy cialis professional</a> Nizagara Cheapest
JanVurl 4个月前 (2020-04-19) 回复
Best Brand Viagra  <a href=https://apcialisle.com/#>Cialis</a> Achat Cialis Us  <a href=https://apcialisle.com/#>buy cialis with paypal</a> 1 Propecia Vs 5 Propecia
Stephar 5个月前 (2020-03-24) 回复
Propecia Preparacion  <a href=http://apcialisle.com/#>Buy Cialis</a> My Cat Ate An Amoxicillin 500  <a href=http://apcialisle.com/#>order cialis online</a> Wirkung Viagra Animation
JanVurl 5个月前 (2020-03-15) 回复
Acheter Cialis Brand  http://abcialisnews.com - cialis 5mg Buy Amoxicillin Children  <a href=http://abcialisnews.com>buy generic cialis online</a> Cheapest Pharmacy To Buy Viagra
Lesbemi 6个月前 (2020-02-17) 回复
Propecia Doctor New York  http://abuycialisb.com - cialis online Cailas  <a href=http://abuycialisb.com>order cialis online</a> Is Generic Levitra Legitimate
Stevfeen 6个月前 (2020-02-13) 回复
Buy Doxycycline In India  http://abcialisnews.com - where to buy cialis online safely Cymbalta From India  <a href=http://abcialisnews.com>cialis from canada</a> Acheter Cialis Ligne Belgique
Lesbemi 6个月前 (2020-02-02) 回复
Perfect Rx Meds Buy Viagra Usa Zithromax Order Online  <a href=http://cialibuy.com>Cialis</a> Achat Kamagra Gel Acticin Where To Buy Renfrewshire
Stevfeen 7个月前 (2020-01-16) 回复
Cephalexin For Dogs Want To Buy Generic Viagra Pills  <a href=http://cialibuy.com>Buy Cialis</a> What Is Best Ed Pill Levitra Controindicazioni Acquisto
Stevfeen 7个月前 (2020-01-10) 回复