Home > Backend Development > PHP Tutorial > javascript - Why can cookies under the second-level domain name be obtained, but cannot be sent back automatically using ajax, and cookies cannot be cross-domain?

javascript - Why can cookies under the second-level domain name be obtained, but cannot be sent back automatically using ajax, and cookies cannot be cross-domain?

WBOY
Release: 2016-08-18 09:16:14
Original
1124 people have browsed it

Scenario recurrence process:

<code>机器A局域网地址:192.168.9.8
机器B局域网地址:192.168.9.9
</code>
Copy after login
Copy after login
<code>分别配置机器A、B的hosts地址:

配置机器A的地址:192.168.9.8 --> a.site.com 
配置机器B的地址:192.168.9.9 --> b.site.com
</code>
Copy after login
Copy after login

Machine A is the front-end js code, starts the service, and requests the first address of machine B (representing the server side) on the browser http://b.site.com:8080/login/... , The server injects cookies at the same time as the request. Set the key of the cookie to 'site', the value to 'date', the doman to .site.com, and the path to /
. Then open a new page on the browser and make a request on the new page. http://a.site.com:8080/index, you can see the injected cookie through chrome console
http://b.site.com:8080/
, but... through ajax During the interface, the cookie did not appear in the request header. I tried various methods, including get, post, asynchronous, and synchronous, but none of them worked. Finally, the jsonp method was used, and the cookie appeared

The code that is not easy to use is as follows:
<code>$("a").click(function(event) {
        $.ajax({
            url: 'http://b.site.com:8080/test/test.htm',
            type: 'post',
            dataType: 'json',
            data: {'token': 'value'},
        })
        .done(function() {
            console.log("success");
        })
        .fail(function() {
            console.log("error");
        })
        .always(function() {
            console.log("complete");
        });
});
</code>
Copy after login
Copy after login

The useful code is as follows:

<code>function flightHandler(data) {
    console.log(data);
    // body...
};

$("a").click(function(event) {
    $.ajax({
         type: "get",
         url: "http://b.site.com:8080/test/test.htm",
         dataType: "jsonp",
         jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
         jsonpCallback:"flightHandler",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据
         success: function(data){
            console.log(data);
         },
         error: function(){
             alert('fail');
         }
     });
});
</code>
Copy after login
Copy after login

Please ask the experts for help. If you can solve the problem, thank you very much

Reply content:

Scenario recurrence process:

<code>机器A局域网地址:192.168.9.8
机器B局域网地址:192.168.9.9
</code>
Copy after login
Copy after login
<code>分别配置机器A、B的hosts地址:

配置机器A的地址:192.168.9.8 --> a.site.com 
配置机器B的地址:192.168.9.9 --> b.site.com
</code>
Copy after login
Copy after login

Machine A is the front-end js code, starts the service, and requests the first address of machine B (representing the server side) on the browser http://b.site.com:8080/login/... , The server injects cookies at the same time as the request. Set the key of the cookie to 'site', the value to 'date', the doman to .site.com, and the path to /
. Then open a new page on the browser and make a request on the new page. http://a.site.com:8080/index, you can see the injected cookie through chrome console

http://b.site.com:8080/
, but... through ajax During the interface, the cookie did not appear in the request header. I tried various methods, including get, post, asynchronous, and synchronous, but none of them worked. Finally, the jsonp method was used, and the cookie appeared



The code that is not easy to use is as follows:

<code>$("a").click(function(event) {
        $.ajax({
            url: 'http://b.site.com:8080/test/test.htm',
            type: 'post',
            dataType: 'json',
            data: {'token': 'value'},
        })
        .done(function() {
            console.log("success");
        })
        .fail(function() {
            console.log("error");
        })
        .always(function() {
            console.log("complete");
        });
});
</code>
Copy after login
Copy after login
The useful code is as follows:
<code>function flightHandler(data) {
    console.log(data);
    // body...
};

$("a").click(function(event) {
    $.ajax({
         type: "get",
         url: "http://b.site.com:8080/test/test.htm",
         dataType: "jsonp",
         jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
         jsonpCallback:"flightHandler",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据
         success: function(data){
            console.log(data);
         },
         error: function(){
             alert('fail');
         }
     });
});
</code>
Copy after login
Copy after login

Please ask the experts for help. If you can solve the problem, thank you very much

withCredentials=true, and ensure that the server allows cross-domain, please refer to cors

for details

A domain is not what you say it is. Cookie domain and ajax domain are not the same thing

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template