ajax跨域请求携带cookie

    由于浏览器的同源策略的限制,不一样域名间的请求会形成跨域问题(同源策略是客户端的限制,服务端的互相请求不会有跨域问题)。通常场景下解决跨域问题经常使用的解决方法都是CORS解决,即配置服务端接受发起请求的域名ios

response.header('Access-Control-Allow-Origin', '*'); // *表示支持全部的域名,能够换成具体的域名
复制代码

    如今ajax的请求能够获得返回值了,可是默认跨域请求是不携带cookie的,若是碰到一些需求必须从cookie中取值,分两种状况ajax

  1. 一级域名相同.二级域名不相同,且cookie在一级域名下,能够设置
document.domain = '一级域名'
复制代码

就能够携带cookie了。axios

2.一级域名不一样,能够配置XMLHttpRequest.withCredentials 来容许ajax请求时携带cookie。跨域

/* jQuery支持跨域携带cookie */
$.ajax({
    type:'get',
    crossDomain:true, //设置跨域为true
    xhrFields: {
        withCredentials: true //默认状况下,标准的跨域请求是不会发送cookie的
    },
}})
复制代码
/* 原生ajax支持 */
var xhr = new XMLHttpRequest()
 xhr.open("GET",url,true);
 xhr.withCredentials = true;
 xhr.send(null);
 xhr.onreadystatechange = function () {
  if(xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
    console.log(xhr.responseText)
  }
}
复制代码
/* axios支持 */
axios.defaults.withCredentials = true
复制代码

    同时服务器server端要配置Access-Control-Allow-Credentials,咱们在客户端设置了withCredentials=true 参数,对应着服务器端要经过在响应 header 中设置Access-Control-Allow-Credentials = true来运行客户端携带证书式的访问。经过对Credentials参数的设置,就能够保持跨域Ajax时传递的Cookie。浏览器

response.setHeader("Access-Control-Allow-Credentials", "true");
复制代码

    服务器server端要配置Access-Control-Allow-Origin到以上配置为止,发送ajax请求,咱们发现还会出现一个错误,提示咱们 Access-Control-Allow-Origin 不能用 * 通配符。缘由是:当服务器端 Access-Control-Allow-Credentials = true时,参数Access-Control-Allow-Origin 的值不能为 '*' 。咱们从新设置Access-Control-Allow-Origin的值,当服务器端接收到请求后,在返回响应时,把请求的域Origin填写到响应的Header信息里(即谁访问我,我容许谁),代码以下:bash

response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
复制代码

最后补充一点ajax的post请求Content-Type,但仅能是下列之一服务器

application/x-www-form-urlencoded
    multipart/form-data
    text/plain
复制代码

否则可能就会报如下的错误cookie

XMLHttpRequest cannot load www.mydomain.com/?/ac... No 'Access-Control-Allow-Origin' header is present on the www.mydomain.com/?/ac... requested resource. Origin 'www.mydomain.com' is therefore not allowed access.app

最后附上cors请求流程图cors

ps:以上内容参考了不少网友的答案,再此表示感谢。

相关文章
相关标签/搜索