axios 请求封装

1，引用axios后直接设置配置，这种配置方式会影响到所有的接口，本人在目前实习阶段就是采用这种写法较多

这里我是将所有的接口地址都写在urls.js下，这里的baseURL可以根据生产环境配置

if(process.env.NODE_ENV === 'development') {
    baseURL = 'xxx本地环境xxx';
} else if(process.env.NODE_ENV === 'production') {
    baseURL = 'xxx生产环境xxx';
}

axios.defaults.baseURL = urls.BASE_URL
axios.defaults.withCredentials = true
axios.defaults.headers['X-Requested-With'] = 'XMLHttpRequest'
// 默认Post请求使用 application/json 形式
axios.defaults.headers.post['Content-Type'] = 'application/json'
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8'
axios.defaults.timeout = 10000

第二种方法就是实例化一个axios对象，这个方法主要的好处就是创建多个axios，一部分接口用一部分axios,属性也都可以设置

let newAxios = axios.create({
    baseURL: 'xxxxx',
    timeout: 1000, 
    withCredentials:true
    //在第二种的基础上可以针对个别接口进行设置
    instance.get('/xxx',{
    timeout: 5000
})

axios请求拦截器

这个时候拦截下来的请求还没有发出，在这个是时候我们可以对这个请求进行各种操作，高级一点的拦截器，还可以根据请求发出的一些信息，进行过滤。例如，一些接口需要token或者其他的登录信息。往往会在后端进行验证，但是在程序请求量非常大的时候，可以在前端进行验证，请求中没有的必要信息的时候进行拦截。

axios.interceptors.request.use(res => { // 封装请求 ... return res }, err => { // 请求出现错误时回调 return Promise.reject(err) })

axios响应拦截器

// axios.interceptors.reponse.use(res => { // 对结果数据进行操作 return res }, err => { //接口处理错误 return Promise.reject(err) })

promise.all # 如果有100个请求，你如何使用Promise控制并发？

function postUrls(path, params, options) {
    let paths = path.split("|");
    let allPromise = [];
    for (let index = 0; index < paths.length; index++) {
        let p1 = new Promise((resolve, reject) => {
            path = url.getWebPath(paths[index]);

            let opts = {
                headers: {}
            };
            if (store.loadSessionStore("loginToken")) {
                opts.headers["x-auth-token"] = store.loadSessionStore("loginToken");
            }
            opts.transformRequest = [
                function(data) {
                    let ret = "";
                    for (let it in data) {
                        ret +=
                            encodeURIComponent(it) + "=" + encodeURIComponent(data[it]) + "&";
                    }
                    return ret;
                }
            ];
            opts = dsf.mix(opts, options || {});
            Axios.post(path, params, opts)
                .then(res => {
                    resolve(res);
                })
                .catch(err => {
                    reject(err);
                });
        });
        allPromise.push(p1);
    }
    // 调用Promise.all().then(res=>{})
    let allPromiseObj = Promise.all(allPromise);
    return allPromiseObj;
}