【Axios】配置

/**
 * vue发送请求的流程
 * page --params--> vuex --params--> api.js --formateParams--> vuex --formateParams--> axios
 */


import axios from 'axios'

// 取消请求的token
let CancelToken = axios.CancelToken;
let source = CancelToken.source();


axios.defaults.baseURL = process.env.VUE_APP_API_BASIC_PATH;
axios.defaults.timeout = 30 * 1000;


/**
 * 添加请求拦截器
 * 用于设置Authorization等
 */
axios.interceptors.request.use(
    function (config) {
        // axios的get请求，默认不带Content-Type，所以手动使Content-Type生效
        if (config.method == 'get') {
            config.data = true
        }
        // 设置身份认证信息
        let auth = localStorage.getItem('auth');
        if (auth) {
            config.auth = JSON.parse(localStorage.getItem('auth'));
        }
        return config;
    },
    function (error) {
        return Promise.reject(error);
    }
);

/**
 * 添加响应拦截器
 * 用于处理响应的数据错误信息
 */
axios.interceptors.response.use(function (response) {
    // 对响应数据做点什么
    return response;
}, function (error) {
    // 对响应错误做点什么
    return Promise.reject(error);
});


/**
 * 取消请求
 * 放在项目的全局调用里（vuex），在跳转页面时，将请求全部清除
 * cancelRequest('取消上传的原因')
 */
let cancelRequest = source.cancel;


/**
 * 发起请求

 let option = {
    method:'post',                      // * 必填 *。
    url:'users/id-123',                 // * 必填 *。
    baseURL:'https://www.***.com/api/', // 选填。只有在请求地址不是axios.default.baseURL时需要
    headers:{},                         // 选填。有自定义的headers属性时填写
    data:{},                            // 选填。
    params:{id:'id-123'}，              // 选填。 url上的参数， ?id=id-123

    auth:{username:'',password:''},     //
    timeout:1000,                       // 选填。
    responseType:'json',                // 选填。表示服务器响应的数据类型，可以是 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream'

    onUploadProgress:function(e){},     // 选填。
    onDownloadProgress:function(e){},   // 选填。

    cancelToken:source.token,           // 选填。单独加cancelToken，比如在上传时，不想页面跳转时，随着其他请求被清除，这时候单独生成cancelToken。使用方法在下面。

    maxContentLength:1000,              // 选填。
    maxRedirects:5,                     // 选填。最大的重定向数目
 }
 request(option).then().catch()

 */

function request(option) {
    let option_init = {
        cancelToken: source.token,
        // method,
        // url,
        // baseURL,
        // params:{},
        // data:{},
        headers: {},
        // auth:{},
        // responseType:'json',
        // onUploadProgress:null,
        // onDownloadProgress:null,
        // maxContentLength:0,
        validateStatus,                         // status在200-300之间，执行resolve，否则reject
        transformRequest: [transformRequest],    // 发送前修改数据；PUT,POST,PATCCH有效； 返回：string、arrayBuffer、stream
        transformResponse: [transformResponse],  // 在then、catch前，修改响应数据

    };
    let option_finally = Object.assign({}, option_init, option);
    return axios(option_finally).then(res => {
        return new Promise((resolve, reject) => {
            let status = res.status;
            if (/^4/.test(status) || /^5/.test(status)) {
                // console.error('请求出错',res)
                reject(res)
            } else {
                resolve(res.data)
            }

        })
    })
}

// status在200-300之间，执行resolve，否则reject
function validateStatus(status) {
    return status >= 200 && status < 300;
}

// 发送前修改数据；PUT,POST,PATCCH有效； 返回：string、arrayBuffer、stream
function transformRequest(data) {
    return data;
}

// 在then、catch前，修改响应数据
function transformResponse(data) {
    return data && (typeof data) == 'string' ? JSON.parse(data) : data;
}


/******************************************************
 * 取消请求示例1，建议在跳转页面时，取消先前的所有未完成请求
 *
 var CancelToken = axios.CancelToken;
 var source = CancelToken.source();


 axios.get('home', {
        cancelToken: source.token,
        headers: {
            'content-type': 'image/jpeg11'
        }
    }
 )
 .catch(function (thrown) {
        if (axios.isCancel(thrown)) {
            console.log('Request canceled', thrown.message);
        } else {
            // 处理错误
        }
    });


 // 取消请求（message 参数是可选的）
 source.cancel('Operation canceled by the user.');
 ******************************************************/


/*******************************************************
 * 取消请求示例2
 *
 var CancelToken = axios.CancelToken;
 var cancel;

 axios.get('/user/12345', {
    cancelToken: new CancelToken(function executor(c) {
        // executor 函数接收一个 cancel 函数作为参数
        cancel = c;
    })
});

 // 取消请求
 cancel();

 ******************************************************/

export {
    axios,
    cancelRequest,
    request
}