$.ajax與axios參考與配置比較

前端項目中跨域請求不得不用到Ajax請求，Jquery配置如下；

const ajaxPost = (url,params) => {
    return new Promise(function (resolve,reject){
        $.ajax({
            type: 'POST',
            dataType: 'json',
            data: params,
            url: url,
            xhrFields: {
                withCredentials: true
            },
            crossDomain: true,
            traditional: true,
            success: data => {
                resolve(data.object)
            },
            error: error => {
               reject(error.object)
            },
            complete: () => {}
        })
    })
}

const ajaxJson = (url,params) => {
    return new Promise(function (resolve,reject){
        $.ajax({
            type: 'POST',
            dataType: 'JSON',
            data: params,
            url: url,
            xhrFields: {
                withCredentials: true
            },
            contentType: "application/json"
            success: data => {
                resolve(data.object)
            },
            error: error => {
               reject(error.object)
            },
            complete: () => {}
        })
    })
}

axios的配置如下；qs庫是用來發送formdata數據的，並且可以改變數據的格式，同時他還可以去掉options預請求

npm install qs --save

const instance = axios.create({
    baseURL: server,
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8'
    },
    transformRequest: [function (data) {
        data = qs.stringfy(data);
        return data;
    }],
    transformResponse:[function (data,header) {
        if (JSON.parse(data).code === 10016) {
            route.push({path: '/login'})
            return
        }
        rerun JSON.stringfy(JSON.parse(data).object)
    }]
})


const HttpGet = function(url, param) {
    return instance.get(url,{params:param})
}

const HttpPost = function(url, params) {
    return instance.post(url,params
}