elementUI项目中，只弹一个【token过期提示】信息框的处理

关键代码 

let msgArr = document.querySelectorAll('.token401Message')if (!msgArr.length) {Message({customClass: 'token401Message',message: response.data.msg,type: 'error',onClose: () => {msgArr = []}})}

完整代码

import axios from 'axios'
import { getToken } from '@/libs/util'
import { Message, Loading } from 'element-ui'
import store from '@/store'
import router from '@/router'
let loadingInstance = null // 记录页面中存在的loading
let loadingCount = 0 // 记录当前正在请求的数量
function showLoading(data) {if (loadingCount === 0) {loadingInstance = Loading.service({lock: true,background: 'rgba(255,255,255,.6)',text: data || ''})}loadingCount++
}function hideLoading() {let timer = setTimeout(() => {loadingCount--if (loadingInstance && loadingCount === 0) {loadingInstance.close()loadingInstance = nullclearTimeout(timer)timer = null}}, 0)
}
const instance = axios.create({// baseURL: baseUrl,timeout: 0,headers: {'Content-Type': 'application/json; charset=utf-8'},withCredentials: true
})
const no_need_to_refresh_token = ['/xxx', // 双因子登录'/xxx', // 验证码登录'/xxx', // 验证码登录获取验证码'/xxx', // 登录接口'/xxx', // 获取配置'/xxx', // 获取策略'/xxx' // 刷新token
]
// 添加请求拦截器
instance.interceptors.request.use(async config => {if (config.loadingShow) {showLoading()}if (getToken()) {config.headers.Authorization = getToken()config.headers['Tenant-ID'] = localStorage.getItem('tenantId')config.headers['UserId'] = localStorage.getItem('uesrId')// 排除双因子 验证码登录 ....if (no_need_to_refresh_token.every(item => config.url.indexOf(item) === -1)) {await store.dispatch('refreshToken')}}return config},error => {if (error.config.loadingShow) {hideLoading()}// 对请求错误做些什么return Promise.reject(error)}
)instance.interceptors.response.use(async response => {if (response.config.loadingShow) {hideLoading()}// token失效if (response.data.code === '401 UNAUTHORIZED') {router.replace({name: 'login',params: {clear: true}})// 只弹一个【token过期提示】信息框的处理let msgArr = document.querySelectorAll('.token401Message')if (!msgArr.length) {Message({customClass: 'token401Message',message: response.data.msg,type: 'error',onClose: () => {msgArr = []}})}return Promise.reject(new Error(response.data.msg || '请求错误'))}// 接口报错if (response.data.code &&(response.data.code !== 'SUCCESS' && response.data.code !== 'S1A00000') &&response.data.code !== '401 UNAUTHORIZED') {if (!response.request.responseURL.includes('account/verification')) {Message({message: response.data.msg,type: 'error'})return Promise.reject(new Error(response.data.msg || '请求错误'))}}return response},async error => {if (error.config.loadingShow || error === undefined) {hideLoading()}Message({message: error,type: 'error'})// 对响应错误做点什么return Promise.reject(error)}
)const http = {get: (path, data, config) =>instance.get(path, {params: data,...config}),delete: (path, data, config) =>instance.delete(path, {data: data,...config}),post: (path, data, config) => instance.post(path, data, config),put: (path, data, config) => instance.put(path, data, config)
}export default http