axios+async/await无痛刷新token

本文参考了axios如何利用promise无痛刷新token,并在此基础上采用await/async 封装,具体的原理可以看那篇文章,本文只是利用await使其看起来更像同步的方法。
使用了这位大神编写的的uni-axios插件
运行中发现你的APP如果token过期了,如果

// 是否正在刷新的标记
let isRefreshing = false
// 重试队列,每一项将是一个待执行的函数形式
let requests = []
http.interceptor.response(async response => { /* 请求之后拦截器 */
    //toekn过期处理 
    if (response.data.code == -401) {
        let {
            config
        } = response
        if (!isRefreshing) {
            console.log(response);
            isRefreshing = true
            let userInfo = uni.getStorageSync('userInfo')
            let [,res] = await uni.request({
                url: `${config.baseUrl}/api/security/token`,
                method: 'POST',
                data: {
                    username: userInfo.account,
                    password: userInfo.password
                },
                header: {
                    'content-type': 'application/x-www-form-urlencoded'
                }
            })
            //说明web端修改了密码,让app跳转到登录页重新登录
            if(res.data.status == -2){   
                console.log(response);
                //关闭请求的遮罩
                uni.hideLoading()
                uni.showToast({
                    icon: "none",
                    title: "登录信息过期,请重新登录!",
                    duration:3000
                })
                uni.removeStorageSync('userInfo')
                uni.reLaunch({url: '../login/login'});
                // 回到登录界面了要记得开门
                isRefreshing = false
                // 回到登录界面了清空这个队列
                requests = []
                return
            }
            //否则保存新的token
            let token = res.data.token
            userInfo.token = token
            uni.setStorageSync('userInfo', userInfo)
            requests.forEach(cb => cb())
            // 重试完了清空这个队列
            requests = []
            isRefreshing = false
            return http.request(config)
        } else {
            console.log(response);
            return new Promise((resolve) => {
                // 将resolve放进队列,用一个函数形式来保存,等token刷新后直接执行
                requests.push(() => {
                    resolve(http.request(config))
                })
            })
        }
    }
    if (response.data.status == -2) { // 服务端返回的状态码不等于200,则reject()
        uni.showToast({
            icon: "none",
            title: "密码错误!"
        })
        return Promise.reject(response)
    }
    console.log(response)
    return response
}, (err) => { // 请求错误做点什么
    uni.showToast({
        icon: 'none',
        position: 'bottom',
        title: '网络异常'
    })
    return err
})

推荐阅读更多精彩内容