VUE封装公共的请求

在units里面创建request.js文件

/*
 * @Author: 
 * @Date: 2021-11-16 00:00:00
 * @LastEditTime: 2021-11-11 00:00:00
 * @LastEditors: 
 * @Description: In User Settings Edit
 * @FilePath: \table-icon\src\units\request
 */
import axios from "axios";
import { Message } from "element-ui";
// import store from "@/store";
// create an axios instance
const service = axios.create({
  // baseURL: '', // url = base url + request url
  withCredentials: true, // send cookies when cross-domain requests
  timeout: 6000 * 10, // request timeout
});

// request interceptor
service.interceptors.request.use(
  (config) => {
    // if (store.getters.token) {
    //   config.headers.Authorization = `Bearer ${getToken()}`
    //   if (getLang() === "en") {
    //     config.headers["Accept-Language"] = "en-US,en;q=0.9";
    //   } else {
    //     config.headers["Accept-Language"] = "zh-CN,zh;q=0.9";
    //   }
    // }
    return config;
  },
  (error) => {
    // console.log(error) // for debug
    return Promise.reject(error);
  }
);

// response interceptor
service.interceptors.response.use(
  (response) => {
    const res = response.data;
    if (response.status !== 200) {
      Message.error({
        message: res.message || res.msg || "Error",
        duration: 3 * 1000,
      });
      return Promise.reject(new Error(res.message || res.msg || "Error"));
    } else {
      if (res.success || res.success === undefined) {
        let filename = response.headers["content-disposition"];
        if (filename) {
          filename = decodeURIComponent(filename.split("filename=")[1]);
          return {
            filename: filename,
            data: res,
          };
        }
        return res;
      } else {
        Message.error({
          message: res.message || res.msg || "Error",
          duration: 3 * 1000,
        });
        return Promise.reject(new Error(res.message || res.msg || "Error"));
      }
    }
  },
  (error) => {
    if (error.request.responseType === "blob") {
      Message.closeAll();
      Message.error({
        message: "服务繁忙，请稍后刷新页面后重试!",
        duration: 3 * 1000,
      });
      return Promise.reject(error);
    } else {
      const response = JSON.parse(error.request.response);
      if (response.resultCode === 401) {
        removeIfLogin();
        location.reload();
      }
      Message.closeAll();
      Message.error({
        message: response.message || response.msg || "服务繁忙，请稍后刷新页面后重试!",
        duration: 3 * 1000,
      });
      return Promise.reject(error);
    }
  }
);

export default service;

在请求页面.js

import request from "@/units/request";
const baseUrl = "/*****"   // 公共的请求url部分，可用于跨域
const api = {
    postList: (data) => {
        return request({
            url: `${baseUrl}/**********`,
            method: "post",
            data,
        })
    },
    getList: (data) => {
        return request({
            url: `${baseUrl}/**********`,
            method: "get",
            params: data,
        })
    }
}
export default api;

页面中直接是引入文件使用时是api.postList(data)、api.getList(data)