Axios 是一个基于 promise 网络请求库，作用于node.js 和浏览器中。 它是 isomorphic 的(即同一套代码可以运行在浏览器和node.js中)。在服务端它使用原生 node.js http 模块, 而在客户端 (浏览端) 则使用 XMLHttpRequests。
在日常前端开发过程中，我们一般是在main.ts(或main.js)中直接引入后挂载到vue上使用，没有单独分模块进行管理，不利于我们后期的代码维护，所以，在学习过面向对象设计原则后，我们要用ts的面向对象方法对其进行封装，而在一个项目中，一般axios是作为一个工具类被我们使用，也就是说可以只创建一个对象，所以这里可以模仿Java中springBoot的单例模式对其进行封装。
什么是单例模式？
单例模式是一种设计模式，其目的是确保一个类仅有一个实例，并提供一个全局访问点来获取该实例。
在单例模式中，类只能有一个实例，并提供一个静态方法或函数来获取该实例。当第一次调用该方法或函数时，会创建实例，并将其保存起来。之后的调用都会返回已存在的实例，而不是创建新的实例。
单例模式的主要特点包括：
- 一个类只有一个实例。
- 提供一个全局访问点来获取该实例。
- 通过私有的构造函数来限制实例的创建。
单例模式的好处包括：
- 提供了一个全局的访问点，方便其他代码对实例进行操作。
- 避免了重复创建实例的开销，提高了性能。
在实际应用中，单例模式经常用于需要管理共享资源的场景，比如数据库连接池、线程池、缓存等。它可以确保资源的唯一性，并提供全局的访问方式，方便其他代码对资源进行操作。
用单例模式对Axios进行封装
import axios, { AxiosInstance } from "axios";interface Instance{baseURL: string;timeout: number;headers: object;
}const instance: Instance = {baseURL: 'http://localhost:3000',timeout: 1000 * 5,headers: {'Content-Type': 'application/json'}
}class Axios{private static axios: Axios = new Axios();private instance: AxiosInstance;private constructor(){this.instance = axios.create(instance);this.instance.interceptors.request.use(config => {if(sessionStorage.getItem("token")){config.headers.Authorization = sessionStorage.getItem("token")}return config;}, error => {console.log("错误", error)return Promise.reject(error)})this.instance.interceptors.response.use(response => {console.log("响应拦截=>", response);if(response.data.code >= 200 && response.data.code < 300){return response.data;}else{return Promise.reject(response.data)}})}public static getAxios(): Axios{return Axios.axios;}public getInstance(): AxiosInstance{return Axios.axios.instance;}
}export default Axios;