1. /*
    2.  * 对Axios的二次封装，目的:把当前项目中，所有请求的公共部分进行统一处理
    3.  *   + axios.defaults 设置公共的配置项
    4.  *   + axios.interceptors 基于拦截器做统一处理
    5.  */
    6. // 配置请求接口的统一前缀「webpack环境，我们根据环境变量的值，设置不同的前缀，来区分不同的环境」
    7. //   + 开发 development
    8. //   + 测试 test
    9. //   + 灰度 grayscale
    10. //   + 生产 production
    11. // $ npm run build/start/test/gray... 设置不同的环境变量
    12. /* const env = process.env.NODE_ENV || 'development';
    13. switch (env) {
    14.     case 'development':
    15.         axios.defaults.baseURL = 'http://127.0.0.1:9999';
    16.         break;
    17.     case 'test':
    18.         axios.defaults.baseURL = 'http://168.1.123.1:9999';
    19.         break;
    20.     case 'production':
    21.         axios.defaults.baseURL = 'http://api.zhufengpeixun.cn';
    22.         break;
    23. } */
    24. axios.defaults.baseURL = 'http://127.0.0.1:9999';
    25. // 设置超时时间{10S} & 设置跨域请求中是否携带资源凭证
    26. axios.defaults.timeout = 10000;
    27. axios.defaults.withCredentials = true;
    28. // 配置公共的自定义请求头信息  headers['common']/headers['post/get...']/headers/...
    29. axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
    30. // POST系列请求对于请求主体信息的统一格式化
    31. axios.defaults.transformRequest = function (data, headers) {
    32.     if (data === null || typeof data !== "object") return data;
    33.     let contentType = headers['Content-Type'] || headers.post['Content-Type'];
    34.     if (contentType.includes('urlencoded')) return Qs.stringify(data);
    35.     if (contentType.includes('json')) return JSON.stringify(data);
    36.     return data;
    37. };
    38. // 设置响应状态码的校验处理{规定服务器返回的状态码哪些是算请求成功，哪些算失败}
    39. axios.defaults.validateStatus = function (status) {
    40.     return status >= 200 && status < 400;
    41. };
    43. // 请求拦截器，当所有配置处理完，在向服务器发送请求之前，我们拦截到现有的配置，再去做一些统一修改
    44. axios.interceptors.request.use(function (config) {
    45.     // 例如：传递Token
    46.     /* const token = sessionStorage.getItem('token');
    47.     if (token) {
    48.         config.headers['Authorization'] = token;
    49.     } */
    50.     return config;
    51. });
    53. // 响应拦截器，当前请求有结果之后，我们在业务层自己调用then/catch方法之间拦截一下，这样可以做一些成功或者失败的统一提示处理等...
    54. axios.interceptors.response.use(function onfulfilled(response) {
    55.     // 成功:服务器正常返回结果 & validateStatus状态码校验成功
    56.     return response.data;
    57. }, function onrejected(reason) {
    58.     // 失败:@1服务器返回了结果但是状态码没有经过validateStatus校验 || @2服务器压根没有返回任何的结果 || @3请求中断或者超时...
    59.     let response = reason.response;
    60.     if (response) {
    61.         // @1
    62.         switch (response.status) {
    63.             case 401:
    64.                 break;
    65.                 // ...
    66.         }
    67.     } else {
    68.         if (reason && reason.code === 'ECONNABORTED') {
    69.             // @3
    70.         }
    71.         if (!navigator.onLine) {
    72.             // @2
    73.         }
    74.     }
    75.     return Promise.reject(reason);
    76. });
    78. export default axios;