AJAX基本使用方法（get，post请求封装）

基本步骤：
1.创建ajax对象

if (window.XMLHttpRequest){
	// code for IE7+, Firefox, Chrome, Opera, Safari
	xhr=new XMLHttpRequest();
}else{
	// code for IE6, IE5
	xhr=new ActiveXObject("Microsoft.XMLHTTP");
}

2.配置ajax对象(type-请求类型post或get,url-请求路径)

xhr.open(type, url);

3.设置请求参数格式的类型(contentType-请求类型(三种如下:))

xhr.setRequestHeader('Content-Type', contentType);
//'application/json'
//'application/x-www-form-urlencoded'
//'multipart/form-data'

4.发送请求(param-发送的参数)

xhr.send(param);

5.监听xhr对象

xhr.onreadystatechange=function(){
	// 获取响应头中的数据
	var contentType = xhr.getResponseHeader('Content-Type');
    if(xhr.status==200 && xhr.readyState==4){
         var result=xhr.responseText;//获取到结果
	}
}

ajax封装：

/**
 * 封装ajax请求
 * options {object} 参数
 * **/

//基础路径
const baseUrl="http://127.0.0.1:3000"
const timeout =1000
function ajax(options){
    let optionsData={
        url: baseUrl + options.url,//路径
        type: (options.type||'get').toUpperCase(),//请求方式
        dataType: options.dataType||'',//数据样式
        data: options.data||{},//数据
        timeout: options.timeout||timeout,//有效时间
        success:options.success,//回调函数
        error:options.error//回调函数
    }

    //创建ajax对象(兼容性)
    var xhr;
    if(window.XMLHttpRequest){
        xhr = new XMLHttpRequest();
    }else if(window.ActiveObject){
        xhr = new ActiveXObject('Microsoft.XMLHTTP');
    }

    //配置ajax对象
    if(optionsData.type =='GET'){
        let arr =[];
        if(JSON.stringify(optionsData.data)!='{}'){
            for(var e in optionsData.data){
                arr.push(e + '='+ optionsData.data[e])
            }
            optionsData.url = optionsData.url+'?'+arr.join('&')
        }
        xhr.open(optionsData.type,optionsData.url,true)
        xhr.send()
    }else if(optionsData.type =='POST'){
        xhr.open(optionsData.type,optionsData.url,true)
        let contentType;//请求头设置
        if(optionsData.dataType =='json'){
            contentType ='application/json'
            optionsData.data =JSON.stringify(optionsData.data)
        }else if(optionsData.dataType =='formdata'){
            let data = new FormData();
            for(var item in optionsData.data){
                data.append(item,optionsData.data[item]);
            }
            optionsData.data = data
            contentType ='multipart/form-data'
        }else{
            let arr = [];
            for(var item in optionsData.data){
                arr.push(item + '=' + optionsData.data[item]);
            }
            optionsData.data = arr.join('&')
            contentType ='application/x-www-form-urlencoded'
        }
        xhr.setRequestHeader('Content-Type',contentType)
        xhr.send(optionsData.data)
    }

    //设置有效时间
    setTimeout(()=>{
        if(xhr.readySate!=4){
            xhr.abort();
        }
    },optionsData.timeout)
    
    //监听
    xhr.onreadystatechange = function(){
        if(xhr.readyState ==4){
            if(xhr.status >=200 && xhr.status<300 || xhr.status== 304){
                optionsData.success && optionsData.success(JSON.parse(xhr.responseText),JSON.parse(xhr.responseXML))
            }else{
                optionsData.error && optionsData.error(xhr.status);
            }
        }
    }
}

异步请求（callback）

function requestData(callback){
    ajax({
        url:"/getALLHero",
        type:'post',
        data:{
            username:'username',
            password:'password'
        },
        dataType:'form',
        timeout:1000,
        success:function(data){
            callback(data)
        },
        //异常处理
        error:function(e){
            callback(e);
        }
    })
  }
  requestData(function (data){
    console.log(allData)
  })