封装请求axios

封装axios

import axios from 'axios';
import FileSaver from 'file-saver';
import { notification, message } from 'antd';

import store from '@/utils/configureStore';

const codeMessage = {
  200: '服务器成功返回请求的数据。',
  201: '新建或修改数据成功。',
  202: '一个请求已经进入后台排队（异步任务）。',
  204: '删除数据成功。',
  400: '发出的请求有错误，服务器没有进行新建或修改数据的操作。',
  401: '用户没有权限（令牌、用户名、密码错误）。',
  403: '用户得到授权，但是访问是被禁止的。',
  404: '发出的请求针对的是不存在的记录，服务器没有进行操作。',
  406: '请求的格式不可得。',
  410: '请求的资源被永久删除，且不会再得到的。',
  422: '当创建一个对象时，发生一个验证错误。',
  500: '服务器发生错误，请检查服务器。',
  502: '网关错误。',
  503: '服务不可用，服务器暂时过载或维护。',
  504: '网关超时。',
};
/**
 * 异常处理程序
 */

const errorHandler = (error) => {
  const { response } = error;

  if (response && response.status) {
    const errorText = codeMessage[response.status] || response.statusText;
    const { status, statusText } = response;
    // notification.error
    notification.error({
      message: `请求错误 ${status}: ${statusText}`,
      description: errorText,
    });
  } else if (!response) {
    notification.error({
      description: '您的网络发生异常，无法连接服务器',
      message: '网络异常',
    });
  }

  return response;
};

const request = axios.create();

function getSignInfo(config) {
  const signDict = {
    signUid: 'uid',
    signCid: 'cid',
    signScid: 'scid',
    signDid: 'did',
  };
  const signKeyMaps = Object.keys(signDict);

  const { params = {}, data = {} } = config;

  const signParams = Object.keys(params)
    .filter((key) => signKeyMaps.includes(key))
    .filter((key) => params[key]);
  const signData = Object.keys(data)
    .filter((key) => signKeyMaps.includes(key))
    .filter((key) => data[key]);
  if (!signParams.length && !signData.length) {
    return config;
  }
  const state = store.getState();
  const { currentUser } = state.user;

  if (signParams.length) {
    const newParams = Object.assign({}, params);
    signParams.forEach((signKey) => {
      const key = signDict[signKey];
      if (!newParams.hasOwnProperty(key) && !newParams[key]) {
        newParams[key] = currentUser[key];
      }
      delete newParams[signKey];
    });
    Object.assign(config, {
      params: newParams,
    });
  }

  if (signData.length) {
    const newData = Object.assign({}, data);
    signData.forEach((signKey) => {
      const key = signDict[signKey];
      if (!newData.hasOwnProperty(key) && !newData[key]) {
        newData[key] = currentUser[key];
      }
      delete newData[signKey];
    });
    Object.assign(config, {
      data: newData,
    });
  }

  return config;
}

function withSign(config) {
  const { params = {}, data = {}, method } = config;
  if (method === 'GET' || method === 'get') {
    params.client_type = 0;
  } else {
    data.client_type = 0;
  }

  return getSignInfo(config);
}

request.interceptors.request.use(withSign, function (error) {
  return Promise.reject(error);
});

request.interceptors.response.use(
  (response) => {
    const res = response.data;
    const { data, errno, msg } = res;
    if (errno === '0' || errno === '200') return data;
    if (errno === '2') {
      message.warning(data.toString());
    } else if (msg) {
      message.warning(msg);
    }
    return Promise.reject(response);
  },
  (error) => {
    errorHandler(error);
    return Promise.reject(error);
  }
);

const requestWithoutWarning = axios.create();

requestWithoutWarning.interceptors.response.use(
  (response) => {
    const res = response.data;
    const { data, errno } = res;
    if (errno === '0' || errno === '200') return data;
    else {
      return Promise.reject(response);
    }
  },
  (error) => {
    console.log(error, 'error');
    errorHandler(error);
    return Promise.reject(error);
  }
);

export default request;
export { requestWithoutWarning };

const requestFormData = axios.create({
  headers: {
    'Content-Type': 'multipart/form-data',
  },
  responseType: 'blob',
});

const getSuffix = (filename) => {
  const pos = filename.lastIndexOf('.');
  if (pos !== -1) {
    const suffix = filename.substring(pos);
    return suffix;
  }
  return false;
};

requestFormData.interceptors.response.use(
  (response) => {
    const blob = new Blob([response.data]);

    const responseType = response.data.type;
    if (responseType === 'application/json') {
      const reader = new FileReader();
      let messageData;
      reader.readAsText(blob);
      reader.onload = function () {
        messageData = JSON.parse(this.result);
      };
      return Promise.reject(messageData);
    }
    const { config } = response;
    const { params } = config;
    if (params && params.fileName) {
      if (getSuffix(params.fileName)) {
        FileSaver.saveAs(blob, params.fileName);
      } else {
        const contentDisposition = response.headers['content-disposition'];
        const filenameMatch =
          contentDisposition && contentDisposition.match(/filename="(.+)"/);
        const filename = decodeURI(filenameMatch[1]);
        const suffix = getSuffix(filename);
        FileSaver.saveAs(blob, params.fileName + suffix);
      }
    } else {
      const contentDisposition = response.headers['content-disposition'];
      const filenameMatch =
        contentDisposition && contentDisposition.match(/filename="(.+)"/);
      const filename = filenameMatch[1];
      FileSaver.saveAs(blob, decodeURI(filename));
    }
    return Promise.resolve();
  },
  (error) => {
    return Promise.reject(error);
  }
);

requestFormData.interceptors.request.use(withSign, function (error) {
  return Promise.reject(error);
});

export { requestFormData };

使用：

//获取审批流
export async function getFlow(params) {
  return request('/api/flow/user/department', {
    method: 'GET',
    params: {
      signCid: true,
      client_type: 0,
      ...params,
    },
  });
}