基于umi封装request请求

项目总结

1.  `export const API_CONFIG = {
      successCode: [0, 200, 20000, 'Success'],
    };
   
    export function checkResponse(response) {
      if (!API_CONFIG.successCode.includes(response.code)) {
         message.error(response.message);
      }
      return API_CONFIG.successCode.includes(response.code);
    }`
   

   自己目前的理解是对请求返回的code进行判断

2.  `import axios from 'axios';
    import { history } from 'umi';
   
    const api = axios.create({
      // baseURL: '/api',
      baseURL: '/mock/api',
      withCredentials: true,
      // timeout: 500
    });`
   

   首先引入请求axios，下面的代码是对环境的区分，根据baseURL自己mock环境和接入后端测试环境的区分

3

    `// 请求拦截
    api.interceptors.request.use(
      (config) => {
        let token = localStorage.getItem('sid');
        if (token) {
          config.headers['Authorization'] = 'Bearer ' + token; // 设置请求头
        }
        if (config.download) {
          // download设置responseType
          config.responseType = 'blob';
        }
        if (config.method === 'get') {
          config.params = {
            ...config.params,
          };
        } else {
          config.data = {
            ...config.data,
          };
        }
        return config;
      },
      (error) => {
        return Promise.reject(error);
      },
    );`

请求拦截，内有token 的判断 下载的判断 get 和其他请求方式的判断，具体怎么使用需要进一步学习

4.

        ` // 返回拦截
        api.interceptors.response.use(
          (response) => {
            if (response.status === 200) {
              if (response.config.download) {
                // download
                let objectUrl = URL.createObjectURL(new Blob([response.data])); // 转换文件下载路径
                let fileName = decodeURI(
                  response.headers['content-disposition'].split('=')[1],
                ); // 获取文件名
                const link = document.createElement('a');
                link.download = fileName;
                link.href = objectUrl;
                link.click();
                return Promise.resolve(response);
              }
              return Promise.resolve(response.data);
            } else {
              return Promise.reject(response);
            }
          },
          (error) => {
            if (error.response.status === 401) {
              history.push('/?overtime=true');
            }
            return Promise.reject(error.response);
          },
        ); `


   对返回的数据进行判断，如果是下载文件需要进行Blob转换
   

5.

    ` export default api;  `
    

导出api，方便调用