关于控制访问详细内容可以参考:  HTTP访问控制(CORS) - HTTP | MDN

在写一个案例时遇到cookie客户端无法携带问题。发现一篇文章写得很好,解决了问题


报错问题:

    Fetch API cannot load https://xxx.com/api. Response to preflight   
    request doesn't pass access control check:   
    The value of the 'Access-Control-Allow-Credentials' header   
    in the response is '' which must be 'true'   
    when the request's credentials mode is 'include'.  
    Origin 'https://xxx.com' is therefore not allowed access.


之所以跨域会引起那么多问题,都是因为耿直的客户端,发什么类型的请求都要服务器允许,而且要明文允许,允许的内容包括如下
1.跨域允许
解决方法:服务器发送允许客户端发送源的报文头
header('Access-Control-Allow-Origin:'.$_SERVER["HTTP_ORIGIN"]);

360桌面截图20190726142637.png

2.客户端无法携带跨域cookie
这个时候就可以在js中加入withCredentials


$.ajax({
    xhrFields: {
        withCredentials: true // 设置运行跨域操作  
    },
    type: "POST",
    url: "http://blog.wdz6.cn/",
    data: "data",
    dataType: 'json',
    success: function (obj) {
    
    
    }
});



3.因为加了withCredentials报文头,可是客户端不知道服务器允不允许报的错(耿直的客户端)
这个时候就在服务器发送Access-Control-Allow-Credentials


header('Access-Control-Allow-Credentials:true');


4.由于客户端不知道服务端是否允许POST请求而报的错
这个时候要在服务器端加入


header('Access-Control-Allow-Methods:OPTIONS, GET, POST');
header('Access-Control-Allow-Headers:x-requested-with');
header('Access-Control-Max-Age:86400');


5.以上汇总

header('Access-Control-Allow-Methods:OPTIONS, GET, POST');
header('Access-Control-Allow-Headers:x-requested-with');
header('Access-Control-Max-Age:86400');
header('Access-Control-Allow-Origin:'.$_SERVER['HTTP_ORIGIN']);
header('Access-Control-Allow-Credentials:true');
header('Access-Control-Allow-Methods:GET, POST, PUT, DELETE, OPTIONS');
header('Access-Control-Allow-Headers:x-requested-with,content-type');
header('Access-Control-Allow-Headers:Origin, No-Cache, X-Requested-With, If-Modified-Since, Pragma, Last-Modified, Cache-Control, Expires, Content-Type, X-E4M-With');
protected function _initialize()
{
        // 是否存在请求源
        if (isset($_SERVER["HTTP_ORIGIN"])) {
            header('Access-Control-Allow-Origin:' . $_SERVER["HTTP_ORIGIN"]);
        }else{
            header('Access-Control-Allow-Origin:*');
        }
        header('Access-Control-Allow-Methods:OPTIONS, GET, POST');
        header('Access-Control-Allow-Headers:x-requested-with');
        header('Access-Control-Max-Age:86400');

        header('Access-Control-Allow-Credentials:true');
}