记录vue使用axios方法

可在改文件统一预处理些错误返回

import axios from 'axios'  //引入axios
axios.defaults.withCredentials = true; //  Cookie 等信息
// 创建一个axios实例
const request = axios.create({
    baseURL: import.meta.env.VITE_BASE_URL,
    timeout: 12000 // 设置超时时间为5s
});

// 请求拦截器
request.interceptors.request.use( config => {
    // 在发送请求之前做些什么
    return config;
}, function (error) {
    // 处理请求错误
    return Promise.reject(error);
});

// 相应拦截器
request.interceptors.response.use( response => {
    // 在2xx范围内的任何状态代码都会触发此功能 responese.status === 200
    // 处理响应数据 response.data.code 接口返回状态码
    // 部分请求状态码是200，但接口返回错误的标识码例如301，也可统一处理
    if (response.data.code === 200) {
    	return response.data; // 当需要的值
    }
}, function (error) {
    // 任何超出2xx范围的状态代码都会触发此功能
    // 处理响应错误
    let message = ''
    switch (error.response.status) {
		case 401:
             message = '您未登录，或者登录已经超时，请先登录！';
             //...处理
             break;
         case 403:
             message = '您没有权限操作！';
             break;
         case 404:
             message = `请求地址出错: ${error.response.config.url}`;
             break; // 在正确域名下
         case 500:
             message = '服务器内部错误！';
             break;
         case 501:
             message = '服务未实现！';
             break;
         case 502:
             message = '网关错误！';
             break;
         case 503:
             message = '服务不可用！';
             break;
         default:
             message = '异常问题，请联系管理员！';
             break
	}
    return Promise.reject(message);
});

export default request  // 导出自定义创建的 axios 对象

声明统一调用方法

import request from "./axios"
const requestFun= (url: string, method: string,data: any) => {
  return request({
    url,
    method,
    data
  })
}
// 可为每种请求定义方法
const get= (url: string, data: any) => {
  return request({  url,  method: 'GET', data })
}
const post= (url: string, data: any) => {
  return request({ url, method: 'POST', data })
}
// 包括请求报文不同
const upload= (url: string, data: any) => {
  return request({ 
	  url,
	  method: 'POST',
	  data,
	  headers: {
	    'Content-Type': 'multipart/form-data'
	 }
  })
}
const download = (url: string, data: any) => {
  return request({ 
	  url,
	  method: 'POST',
	  data,
	  responseType: 'blob' //arraybuffer
  })
}
export {
  get,
  post,
  upload,
  download
}