## 起因 在调试一个网站项目的时候,发现字体图标出不来,然后检查路径发现引用没用问题,添加 CDN 字体之后可以正常出来。打开浏览器调试工具,在控制台出现错误提示如下错误:*已拦截跨源请求:同源策略禁止读取位...
起因
在调试一个网站项目的时候,发现字体图标出不来,然后检查路径发现引用没用问题,添加 CDN 字体之后可以正常出来。打开浏览器调试工具,在控制台出现错误提示如下错误:已拦截跨源请求:同源策略禁止读取位于 https://domain.com/css/fonts/fontawesome-webfont.woff?v=4.4.0 的远程资源。(原因:CORS 头缺少 'Access-Control-Allow-Origin')。[详细了解]
因此确定了错误是跨域的问题。
解决办法:
百度了一下解决方法有很多,下面列举一下以备查使用:
在被请求页面的<head></head>
中加入同源访问控制标签,代码如下,最好 content 中填入站点域名。
<meta http-equiv="Access-Control-Allow-Origin" content="*">
在 PHP 项目中,可以使用 header 函数,在请求控制器中加入 header 头。
header("Access-Control-Allow-Origin: *");
在 http 服务软件中加入 Access-Control-Allow-Origin 跨域配置
IIS 配置: 仅需在 IIS 配置中添加 HTTP 响应标头即可。
Access-Control-Allow-Headers:Content-Type, api_key, Authorization
Access-Control-Allow-Origin:*
Apache 配置:修改配置文件 http.conf(主配置文件)或 vhost.conf(虚拟主机配置文件)中加入 Header set Access-Control-Allow-Origin *
,例如:
<Directory “/Users/cindy/dev”>
AllowOverride ALL
Header set Access-Control-Allow-Origin *
···
或者,也可以修改 Apache 的伪静态规则文件 .htaccess。
Nginx 配置:修改主配置文件 nginx.conf,加入如下代码:
location ~* .(eot|ttf|woff|svg|otf)$ {
add_header Access-Control-Allow-Origin *;
}
上面的 eot|ttf|woff|svg|otf,表示请求后缀类型,或者也可以直接写如下代码:
location / {
add_header Access-Control-Allow-Origin *;
}
参考文章 来源:付杰博客 作者:付杰 原文:原因:CORS 头缺少 ‘Access-Control-Allow-Origin’ 解决办法
-
发表于 2020-01-04 11:55:33
- 阅读 ( 172 )