网站启用CDN后，字体图标为何出现Access-Control-Allow-Origin错误？

本文共计356个文字，预计阅读时间需要2分钟。

网站添加了CDN后，字体图标报错Access-Control-Allow-Origin，原本直接修改CDN的配置即可解决。这两天将自己做的网站（PM老猫）上线了，上线后发现因之前购买的服务器带宽较小，首次打开网页较慢。

网站加了CDN后，字体图标报错Access-Control-Allow-Origin,原来直接修改CDN的配置就可以搞定

这两天将自己做的网站(PM老猫)上线了，上线后发现因为之前购买的服务器带宽较小，第一次打开网站页面就会比较慢，想着给网站加了个CDN，让静态文件直接通过CDN访问。网上一找发现可以白嫖的CDN服务挺多的，想着之前服务器就是白嫖的腾讯云，于是CDN也直接想到了腾讯云CDN，开通服务绑定域名就直接赠送了半年每月20G的流量包。每月20G对于这种个人的小网站完全够用了。

没想到开通CDN遇到的第一个问题，就是网站图标全都显示不出来，查看页面信息访问CDN的图标文件报：has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is

于是百度了一下好多答案都差不，有给服务器iis添加HTTP响应标头的：

Access-Control-Allow-Headers：Content-Type, api_key, Authorization
Access-Control-Allow-Origin：*
Access-Control-Allow-Methods：OPTIONS,POST,GET
也有给静态页面加meta标签的：

<meta www.mroldcat.top/upfile/Images/banner/202206/062405415860.png替换成cdn地址tcdn.mroldcat.top/upfile/Images/banner/202206/062405415860.png