浏览器中后台发起的一个异步ajax请求,服务器做响应时,附带了cookie信息,那么后续对同域名下其他页面请求时,该cookie是否有效,会一并随请求提交到web服务器呢?
自己是对web相关的标准不熟,只知道在普通前台请求时这种cookie会有效,对ajax请求的情况就暂时不确定。但想知道该问题的答案究竟是什么,去翻阅相关的标准是远水救近火。本着It's easier to check than to guess的原则,决定先写段程序来验证这个问题。相关代码如下
发起ajax请求的html页面test.html的代码为
<script type="text/javascript" src="lib/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
$.get('/api/async', function(result){
window.location.href=result.url;
}, 'json')
</script>
后台'/api/async'服务程序的代码为
import web
import json
class async:
def GET(self):
web.setcookie('web', 'python')
return '{"url": "/api/index"}'
class index:
def GET(self):
cookies = web.cookies()
return json.dumps(cookies)
routes = (
'/api/async', 'async',
'/api/index', 'index'
)
app = web.application(routes, globals(), False)
app.run()
我们用先访问test.html页面,在其中触发异步ajax访问'/api/async',如代码所示,其响应结果有cookie信息,并且body是json数据,有一个url为'/api/index',test.html在收到响应后就前台跳转访问该url,'/api/index'服务响应中会将所有的cookie信息原样返回给浏览器。
对比'api/index'返回的结果与'/api/async'中设置的cookie,就可以知道前面问题的答案了,实际验证结果如下图所示
可以看出,ajax异步请求'/api/async'的响应中设置的cookie,对后续其他其他前台页面的请求是有效的
Ajax跨域请求COOKIE无法带上的解决办法
原生ajax请求方式:
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://xxxx.com/demo/b/index.php", true);
xhr.withCredentials = true; //支持跨域发送cookies
xhr.send();
jquery的ajax的post方法请求:
$.ajax({
type: "POST",
url: "http://xxx.com/api/test",
dataType: 'jsonp',
xhrFields: {
withCredentials: true
},
crossDomain: true,
success:function(){
},
error:function(){
}
})
服务器端设置:
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Origin: http://www.xxx.com");