拦截器封装

   /**
 * @param Interceptors --- 
 * wcz
 */
import axios from "axios"
import { hostUrl } from './public'
export default class Interceptors {
    public insatance: any
    constructor() {
        this.insatance = axios.create({
            timeout: 15000,
            baseURL: hostUrl,
        })
        this.initInstance()
    }
    //获取创建的axios实例
    public getInstance() {
        return this.insatance
    }
    //初始化axios实例
    private initInstance() {
        this.setResponseInterceptors()
        this.setRequestInterceptors()
    }
    //请求拦截
    private setResponseInterceptors() {
        this.insatance.interceptors.response.use((res: any) => {
            return new Promise((resolve, reject) => {
                if (res.status == 200) {
                    resolve(res.data)
                } else {
                    //及时请求成功，不是两百也代表请求错误
                    reject(res)
                }
            })
        }, (error: any) => {
            //请求错误直接进行下一步操作
            this.handleBadEesponse(error)
            return Promise.reject(error)
        })
    }
    //响应拦截
    private setRequestInterceptors() {
        this.insatance.interceptors.request.use((config: any) => {
            if (config.headers['valid']) {
                //如果需要登录可以设置添加token再请求
                const token: string | null = sessionStorage.getItem('token')
                if (token) {
                    config.headers['token'] = token
                    return config
                } else {
                    console.log('缺失token')
                }
            } else {
                //不需求登录就直接请求
                return config
            }
        }, (error: any) => {
            console.log('请求出错啦', error)
            return Promise.reject(error)
        })
    }
    private handleBadEesponse(res: any) {
        switch (res.status) {
            case 401:
                if (sessionStorage.getItem('token')) {
                    console.log('登录超时')
                };
                //这里可以跳转登录超时
                //router.replace({path:'/login',query:{redirct:router.currentRoute.fullPath}})
                break;
            default: console.log('请求错误')
        }
    }
} 

https封装

   interface HttpsApi {
    axios: any,
    valid: boolean,
    post(url: string, data?: object): void
    get(url: string, data?: object): void
}
class Https implements HttpsApi {
    public axios: any
    public valid: boolean
    constructor(Interceotors: any, valid: boolean = false) {
        this.axios = new Interceotors().getInstance()

        this.valid = valid
    }
    //post请求封装
    public post(url: string, data?: object) {
        return new Promise(async (resolve, reject) => {
            try {
                const res = await this.axios({
                    method: 'post',
                    url,
                    data
                })
                if (res.code == 200 || res.code == 1) {
                    resolve(res.data)
                } else {
                    console.log('code,post请求错误')
                    console.log(res)
                    resolve(res)
                }
            } catch (error) {
                // console.log(error)
                reject(error)
            }

        })
    }
    //get请求封装
    public get(url: string, data?: any) {
        return new Promise(async (resolve, reject) => {
            try {
                const res = await this.axios({
                    method: 'get',
                    url,
                    params: data
                })
                if (res.code == 200 || res.code == 1) {
                    resolve(res.data)
                } else {
                    console.log('code,get请求错误')
                    resolve(res)
                }
            } catch (error) {
                // console.log('请求失败')
                reject(error)
            }

        })
    }
}
export default Https 

自己写的封装。。不是太完善