1. 安装所需的依赖库

    npm i axios -S
    npm i qs -S

2. 创建独立文件并引入axios

    // touch libs/https.js
    import axios from 'axios'
    import qs from 'qs'

3. 根据（生产、测试、研发）环境设置baseUrl

    if (env == 'production') {
        axios.defaults.baseURL = 'https://www.littlegao.com/';
    } else if (env === 'test') {
        axios.defaults.baseURL = 'http://test.littlegao.com/';
    } else {
        axios.defaults.baseURL = 'http://localhost:3000/';
    }

4. 设置其他默认配置

    axios.defaults.timeout = 10000; //超时时间
    axios.defaults.withCredentials = true; // 跨域是否如果携带凭证，不设置跨域则不能携带cookie
    axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded'; // 设置请求头，告知服务器请求数据格式(与接口协商格式)
    axios.defaults.transformRequest = data => qs.stringify(data); // 只对post请求起作用

5. 设置拦截器

    // 请求拦截器
    axios.interceptors.request.use(config => {
        const token = localStorage.getItem('token'); // 接口认证校验参数
        token && (config.headers.Authorization = token); // 如果存在token，则设置头信息
        return config;
    }, error => {
        return Promise.reject(error)
    });
    
    // 响应拦截器
    axios.defaults.validateStatus = status => { // 拦截响应状态2/3开头,不是必须
        return /^(2|3)d{2}$/.test(status);
    }
    axios.interceptors.response.use(response => {
        return response.data;
    }, error => { // 如果不是2，3开头的
        let { response } = error
        if (response) {
            switch(response.status) {
                case 401: // 认证未通过，未登录
                    break;
                case 403: // 已请求，但服务器拒绝（一般是token过期）
                    break;
                case 404: // 请求的资源未找到
                    break;
                    ...
                default: 
                    break;
            }
            return Promise.reject(error.response);
        } else {
            // 网络连接失败
            if(!window.navigator.onLine) {
                //处理断网情况
                return;
            }
            return Promise.reject(error);
        }
    });
    
    

6. 导出

    export default axios;