解决ajax发送请求无法设置cookie问题

解决ajax发送请求无法设置cookie问题

前端jquery

let url = 'http://www.baidu.com'

let url1 = 'http://www.baidu.com'

let username = 'abc'

let password = 'abc'

$.ajax({

          url: url,

          type: 'post',

          data: {

            mobile: username,

            mobilepwd: password,

          },

          xhrFields: {

            withCredentials: true

          },

          dataType: 'json',

          success: function (res) {

            console.log(res)

            if (res.status == 1) {

              window.location.href = url

            }

          }

        })

前端vue

var $this = this;

let url = 'http://www.baidu.com'

let data = {

    mobile:123,

    mobilepwd:123,

}

$this.$axios.defaults.withCredentials = true

$this.$axios.post(url,data)

  .then((res) => {

    console.log(res.data)

  })

php后台设置

header('Access-Control-Allow-Origin:'.$_SERVER['HTTP_ORIGIN']);

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

解释两个header的作用

我们在客户端设置了withCredentials=true 参数，对应着，服务器端要通过在响应 header 中设置Access-Control-Allow-Credentials = true来运行客户端携带证书式的访问。通过对Credentials参数的设置，就可以保持跨域Ajax时传递的Cookie。

发送ajax请求，我们发现还会出现一个错误，提示我们Access-Control-Allow-Origin不能用*通配符。原因是：当服务器端Access-Control-Allow-Credentials = true时，参数Access-Control-Allow-Origin的值不能为'*'。

我们重新设置Access-Control-Allow-Origin的值，当服务器端接收到请求后，在返回响应时，把请求的域Origin填写到响应的Header信息里（即谁访问我，我允许谁）