原生ajax + Promise 封装

有老项目前后不分离那种。。。。所以。。。哎

此处是用 form data格式的传参  

async function getAjax(type,url,params,errTip=null) {
        return new Promise((resolved,rejected)=>{

            //创建ajax对象
            let ajax;
            //注意,不要根据浏览器的navigator.userAgent来检测浏览器是否支持某个JavaScript特性,一是因为这个字符串本身可以伪造,二是通过IE版本判断JavaScript特性将非常复杂。
            if (window.XMLHttpRequest) {
                ajax = new XMLHttpRequest();
            } else {
                ajax = new ActiveXObject('Microsoft.XMLHTTP');
            }
			ajax.responseType = 'json';

            if(type == 'get' || type == ''){//get
                //配置参数
                ajax.open('get',url,true)
                //发送请求
                ajax.send();
            }else if(type == 'post'){//post
				data = new FormData();
				for (let index in params) {
					if (params.hasOwnProperty(index)) {
						//data.append(index,encodeURI(encodeURI(params[index])));
						//data.append(index,params[index]);
                        //这里有个小坑 不能直接传null,会直接转为‘null’字符串
                        let val=params[index]==null?'':params[index];
					    data.append(index,val); 
					}
				}
                //配置参数
                ajax.open('post',url,true);
                //如果后台接收的是json格式数据,需要这样设置请求头
				//ajax.setRequestHeader('Content-Type', 'application/json');

				//如果后台接收的是form data格式的传参  不需要设置请求头
				//ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset-UTF-8");
				//这种要  'userName=tim&userPass=123456',
                
				//发送请求,并将数据传递过去 如果后台接收的是json格式数据
                //ajax.send(JSON.stringify(params));

				ajax.send(data);

		// FormDate对象是XMLHttpRquest2级的类型,利用XHR对象发送FormDate生成的数据时,可以直接发送,不需要设置头部,XHR对象能够会自动识别数据类型是FormDate的实例,并配置相关的头部;
		// 如果你使用的是XMLHttpRquest级的方法,没有FormDate方法,发送数据时需要设置头部为"application/x-www-form-urlencoded;",然后把序列化后的表单数据发送到服务器。
		// 这里使用混淆了。
            }

            //请求成功之后
            ajax.onreadystatechange = function (){
                if (ajax.readyState === 4){
                    if(ajax.status === 200){
						if(ajax.response.result==0){
							Toast.show(ajax.response.errorMsg || errTip || "接口异常请重试" );
							loadpross(1);
							return false
						}else{
							resolved(ajax.response);
						} 
                    }else{
						Toast.show(ajax.response.errorMsg || errTip || "接口异常请重试" );
						loadpross(1);
						return false
                        //rejected(ajax.response);
                    }
                }
            }

        })
    }

 调用:

let qq = await getAjax('post', '/Wxcard/ySHealthCardRegister', {id:999})

上面要注意有个小坑 不能直接传null,会直接转为‘null’字符串,因为用的是FormData

value时只接收String和Blob,也就是字符串和二进制文件,而JS是弱语言,
所以在传入时调用了Object.toString(),把null转化成了“null”
 let val=params[index]==null?'':params[index];
  data.append(index,val);  

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值