【Ajax设置请求头】withCredentials :true

ajax 跨域访问

as been blocked by CORS policy: Request header field withcredential is not allowed by Access-Control-Allow-Headers in preflight response.在这里插入图片描述通过更新Cookie的属性来解决这个问题:如果打算在跨站点上下文中设置Cookie,则指定相同的=none和安全的。请注意,只有通过https发送的Cookie才能使用安全属性。如果饼干不应该由跨站点请求设置,则指定样本=严格或样本=lax。
在这里插入图片描述

在这里插入图片描述为什么我自己写的ajax 添加请求头就不行
在这里插入图片描述

用jQuery 的 Ajax就可以
在这里插入图片描述我自己封装的Ajax

 /**
 * @file
 * @author xiaofan (1324193551@qq.com)
 * @version 1.0 2022.1.18
 * @description ajax
 * @param method (string) 发送请求方法
 * @param url (url)   访问地址 请求url路径
 * @param data
 * @param successFunction
 * @param errorFunction
 */

function ajaxFunc({method, url, data, successFunction, errorFunction}) {
    var xml = null;
    console.log("err data " +data)
    console.log("err method" +url)
    //兼容性
    if (window.XMLHttpRequest) {
        xml = new XMLHttpRequest();
    } else {
        xml = new ActiveXObject("Microsoft.XMLHTTP");
    }
    //get 请求方法  看看有没有参数
    if (method == "get" && data) {
        //构造有参数的请求url
        url += "?" + queryString(data);
        console.log( url);

    }
    //构造请求
    xml.open(method, url, true);
    //无法设置跨域的请求头
  xml.setRequestHeader("withCredentials","true");
 //  xml.setRequestHeader("crossDomain", "true")
    if (method == "get") {
        xml.send();
    } else if (method == "post") {
        //post 方法  设置数据格式  表示客户端提交给服务器文本内容的编码方式是URL编码,即除了标准字符外,每字节以双字节16进制前加个“%”表示
        xml.setRequestHeader("content-type", "application/x-www-form-urlencoded")
        //data是否存在
        console.log("err method" +data)
        data ? xml.send(queryString(data)) : xml.send();
    } else {
        console.log("err method" + method)
    }

    //判断发送状态,成功则调用执行函数
    xml.onreadystatechange = function () {
        if (xml.readyState == 4) {
            if (xml.status == 200) {
                if (successFunction && M.isFunction(successFunction)) {
                    successFunction(this);
                }
                console.log("err" + xml.statusText + xml.status + xml.readyState+ xml.responseText)
            } else {
                console.log("err" + xml.statusText+ xml.status + xml.readyState +xml.responseText)
                if (errorFunction && M.isFunction(errorFunction)) {
                    errorFunction(this);
                }

            }
        }
    }

    /**
     *
     * @param obj data 对象
     * @returns {string} url请求格式的数据
     */
    function queryString(obj) {
        let str = ""
        for (let attr in obj) {
            str += attr + "=" + obj[attr] + "&";
        }
        console.log(str)
        return str.substring(0, str.length - 1)

    }


}


///调用获取个人信息
    ajaxFunc({
        method: "get",
        url: "http://60.205.224.92/data/gtchMain/test/account/getUserInfo",
        //成功加载信息
        successFunction: function (xml) {
            console.log(xml.responseText);
            console.log(xml.responseXML);
        },
        //失败返回登录
        errorFunction: function () {

        }
    })

jquery ajax 可以添加 withCredentials: true

 $.ajax({
     type : "get",
     url : "http://60.205.224.92/data/gtchMain/test/account/getUserInfo",
     dataType : "text",
     xhrFields: {
         withCredentials: true
     },
     crossDomain: true,
     success :function (data , status) {
console.log(data+status)
         console.log(data)

         console.log(data.toString())
     }
 })
    console.log("xml.responseXML");

}   

欢迎留言交流学习

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值