解决跨域请求被拦截:缺少 Access-Control-Allow-Origin 标头

浏览器提示已拦截跨源请求时的六种解法:PHP、JSON、HTML 加响应头,服务器与宝塔面板配置,JSONP、crossdomain.xml,以及阿里云 OSS 跨域规则。

一、 在程序中添加HTTP头

PHP

header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");

JSON

{
  'Access-Control-Allow-Origin': '*', 
}

HTML

<meta http-equiv="Access-Control-Allow-Origin" content="*">

二、在服务器中添加

在被请求的网站上,设置HTTP头,添加

"Access-Control-Allow-Origin:*" //值为*或指定的域名。

三、 使用JSONP格式

在jQuery中ajax请求参数dataType:‘JSONP’

<script> 
    $.ajax({ 
        url:"https://map.oicqzone.com/gpsApi.php?lat=22.502412986242&lng=113.93832783228", 
        type:'GET', 
        dataType:'JSONP',  // 处理Ajax跨域问题
        success: function(data){ 
            $('body').append( "Name: " + data ); 
        } 
    }); 
</script>

四、在服务器创建

在被请求服务器根目录下创建:“crossdomain.xml”的文件,内容如下:

<?xml version="1.0"?>
<cross-domain-policy>
  <allow-access-from domain="*" />
</cross-domain-policy>

五、 在宝塔面板添加

在站点修改 > 配置文件内添加如下代码

    add_header 'Access-Control-Allow-Origin'   '*';
    add_header 'Access-Control-Allow-Credentials'   'true';
    add_header 'Access-Control-Allow-Methods'  'GET, POST, OPTIONS';

六、 在aliyun-oss添加

在OSS内选择权限管理 > 跨域设置

创建规则 > 输入网站 > 根据需求勾选Methods

我这里直接全勾,根本不给它反应时间,反手一个确定就解决了

如果还不好就删了规则重新创建,可能我手太快他没反应过来


评论