axios二次封装

前言：

最近在翻看以前的项目时，发现了在项目经常需要用到的axios的二次封装，总结一下，方便以后的使用：

import axios from 'axios';

// 创建自定义的 Axios 实例
const instance = axios.create({
  baseURL: 'http://110.40.173.100:5173/api', // 设置基础URL
  timeout: 5000, // 设置请求超时时间
});
// 添加请求拦截器
instance.interceptors.request.use(
  (config) => {
   config.headers["Access-Control-Allow-Origin"] = "*" // 允许跨域
    const token = localStorage.getItem('token'); // 从本地存储获取token
    if (token) {
      // 在发送请求之前做一些处理，例如添加请求头、处理请求参数等
      config.headers.Authorization = token; // 在请求头中添加身份验证令牌
    }
    return config;
  },
  (error) => {
    // 处理请求错误
    console.error('Request error:', error);
    return Promise.reject(error);
  }
);

// 添加响应拦截器
instance.interceptors.response.use(
 (response) => {
    if (response.status === 200) {
      return Promise.resolve(response.data)
    } else {
      return Promise.reject(response.data)
    }
  },
  (error) => {
    let message = ""
    const status = error.response.code
    switch (status) {
      // 401: 未登录
      // 未登录则跳转登录页面，并携带当前页面的路径
      // 在登录成功后返回当前页面，这一步需要在登录页操作。
      case 401:
        message = "未登录"
        break
      // 403 token过期
      // 登录过期对用户进行提示
      // 清除本地token和清空vuex中token对象
      // 跳转登录页面
      case 403:
        message = "登录过期，请重新登录"
        break
      case 404:
        message = "网络请求不存在"
        break
      case 500:
        message = "服务器出现问题"
        break
      default:
        message = error.response.data.message
        break
    } 
return Promise.reject(error)
  }
));
export default instance;