字体文件被CORS政策阻止 [英] Font files are blocked by CORS policy
问题描述
我想构建一个由CDN提供程序加速的服务器,该服务器为我的其他网站提供静态文件.我决定使用 https://www.funfun.org.cn ,然后使用 https://www.funfun.org.cn/libs/font-awesome.min .css 和 https://www.funfun.org.cn /libs/octicons.min.css 应该可以被其他网站使用.
I want to build a server accelerated by a CDN provider, which serves static files for my other websites. I decide to use https://www.funfun.org.cn, then for example https://www.funfun.org.cn/libs/font-awesome.min.css and https://www.funfun.org.cn/libs/octicons.min.css should be able to be used by other websites.
但是,当我通过本地站点中的网站测试此服务器时,会看到以下错误:
However, when I test this server by my website in localhost, I see the following errors:
例如
通过' https://www.funfun.org.cn/访问字体libs/octicons.woff "来自 来源' https://localhost:3000 '已被CORS政策阻止:否 请求中存在"Access-Control-Allow-Origin"标头 资源.因此,不允许来源' https://localhost:3000 ' 访问.
Access to Font at 'https://www.funfun.org.cn/libs/octicons.woff' from origin 'https://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://localhost:3000' is therefore not allowed access.
其他错误与https://www.funfun.org.cn/fonts/fontawesome-webfont.woff2?v=4.4.0
和https://www.funfun.org.cn/libs/octicons.ttf
等类似.
在我的网站中,没有直接调用上述那些文件,关于字体,我只有以下两行,它们必须称为.ttf
和.woff2
等.
In my website, those above files are not called directly, I only have the following two lines regarding fonts, which must have called the .ttf
and .woff2
, etc.
<link rel="stylesheet" href="https://www.funfun.org.cn/libs/font-awesome.min.css">
<link rel="stylesheet" href="https://www.funfun.org.cn/libs/octicons.min.css">
那么,有谁知道我该怎么做才能解决这些错误?
So, does anyone know what I can do to fix those errors?
PS:我的nginx配置文件如下,所有文件都在/var/www/html/libs/
和/var/www/html/fonts/
下.
PS: my nginx configuration file is as follows, and all the files are under /var/www/html/libs/
and /var/www/html/fonts/
.
server {
listen 443 ssl;
ssl_certificate /etc/nginx/cert/1530490648293.pem;
ssl_certificate_key /etc/nginx/cert/1530490648293.key;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on;
ssl_dhparam /etc/ssl/certs/dhparam.pem;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
ssl_session_timeout 1d;
ssl_stapling on;
ssl_stapling_verify on;
add_header Strict-Transport-Security max-age=15768000;
root /var/www/html;
server_name funfun.org.cn www.funfun.org.cn;
location / {
try_files $uri $uri/ =404;
}
}
推荐答案
尝试将其添加到您的配置中:
Try adding this into your configuration:
location ~* \.(eot|otf|ttf|woff|woff2)$ {
add_header Access-Control-Allow-Origin *;
expires max;
}
location / {
try_files $uri $uri/ =404;
}
另外,您可能需要使用以下内容更新nginx mine.types
文件:
Also you may need to update the nginx mine.types
file with something like:
application/x-font-ttf ttc ttf;
application/x-font-otf otf;
application/font-woff woff;
application/font-woff2 woff2;
application/vnd.ms-fontobject eot;
这篇关于字体文件被CORS政策阻止的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!