vue

Axios

2021-05-31  本文已影响0人  斗伽

axios源码阅读

umi-request、fetch、Axios对比.png

axios简单封装

import axios from 'axios';
import store from '@/store';
import Cookies from 'js-cookie';
import { COOKIES_CONSTANTS } from '@/constants';
import i18n from '@/lang';
import { Message } from 'element-ui';
import router from '@/router';
import { IDS_API } from '@/api';

axios.defaults.timeout = 600000;

axios.interceptors.request.use(
  config => {
    const token = store.state.account.token || Cookies.get(COOKIES_CONSTANTS.TOKEN);
    // 添加请求头
    config.headers = {
      ...config.headers,
      Authorization: token,
      appCode: process.env.VUE_APP_APP_CODE
    };
    // console.log(config);
    // 指定语言
    const acceptLanguage = {
      'en': 'en-us,en;q=0.5'
    }[i18n.locale];
    if (acceptLanguage) {
      config.headers['Accept-Language'] = acceptLanguage; // 请求的header中带上语言
    }
    return config;
  },
  err => {
    return Promise.reject(err);
  }
);

axios.interceptors.response.use(
  response => response,
  // 异常处理
  error => {
    const { response = {} } = error;
    const { status, data = {} } = response;
    const { msg } = data;
    Message.error({
      400: {
        message: 'Session timeout, please login again',
        onClose: () => IDS_API.login(router.history.current.fullPath) // 指定登出的path,重新登录后可以回到path
      },
      401: 'Authorization failed',
      404: 'Resource not found',
      500: 'Server error'
    }[status] || msg || 'System error!');
    return response ? Promise.reject(data) : Promise.reject(error);
  }
);

const request = (method, url, params = {}) => {
  return new Promise((resolve, reject) => {
    axios[method](url, params).then(response => resolve(response.data)).catch(error => reject(error));
  });
};

export default {
  axios,
  get (url, params) {
    return request('get', url, { params });
  },
  post (url, params) {
    return request('post', url, params);
  },
  patch (url, params) {
    return request('patch', url, params);
  },
  put (url, params) {
    return request('put', url, params);
  },
  delete (url, params) {
    return request('delete', url, { params });
  }
};

上一篇 下一篇

猜你喜欢

热点阅读