原生js封装ajax请求方法,支持post、get请求

使用方式

ajax({
                url:base + '/api/luck/findSys',
                type:'post',
                data:JSON.stringify(data),//注意这里需要将你的数据对象转成字符串!!!必要一步
                success:res=>{
                    res = JSON.parse(res)  //接收到的返回内容也是字符串格式,如果你想,也可以再二次封装
                    if(res.code == 0){
                        console.log(res.data)
                    }
                },error:err=>{
                    console.log(err)
                }
              },token)

以下是封装请求

ajax(options,tokena){
                //创建一个ajax对象
                var xhr = new XMLHttpRequest() || new ActiveXObject("Microsoft,XMLHTTP");
                //数据的处理 {a:1,b:2} a=1&b=2;
                var str = "";
                for(var key in options.data){
                    str+="&"+key+"="+options.data[key];
                }
                str = str.slice(1);
                if(options.type == "get"){
                    var url = options.url+"?"+str;
                    xhr.open("get",url);
                    xhr.send();
                }else if(options.type == "post"){
                    xhr.open("post",options.url);
                    // 这里添加了我项目的请求头信息
                    xhr.setRequestHeader("X-Authorization",'Bearer ' + tokena);
                    //
                    xhr.setRequestHeader("Content-type","application/json;charset=UTF-8");//可以发送json格式字符串
                    xhr.send(options.data)
                }
                //监听
                xhr.onreadystatechange = function(){
                    //当请求成功的时候
                    if(xhr.readyState == 4 && xhr.status == 200){
                        var d = xhr.responseText;
                        //将请求的数据传递给成功回调函数
                        options.success&&options.success(d)
                    }else if(xhr.status != 200){
                        //当失败的时候将服务器的状态传递给失败的回调函数
                        options.error&&options.error(xhr.status);
                    }
                }
            }

如果帮到你,不要吝啬您的赞

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值