vue axios 响应拦截 token失效导致出现多个提示框的

最新推荐文章于 2024-06-26 19:18:11 发布

攻^城^狮

最新推荐文章于 2024-06-26 19:18:11 发布

阅读量1.4k

点赞数

文章标签： vue.js js vue javascript html

本文链接：https://blog.csdn.net/weixin_42562086/article/details/124058220

版权

这篇博客探讨了如何使用HTTP响应拦截器来处理API请求的响应，特别是当遇到错误状态如404和10020时。在用户会话过期的情况下，拦截器能够移除用户信息，跳转到登录页面，并显示警告消息，避免多次弹出提示框。同时，它还介绍了防止多个提示框出现的解决方案。

摘要由CSDN通过智能技术生成

// 响应拦截器 
let isToken=false
request.interceptors.response.use((res)=>{  
    // 没错误返回200  错误·拦截  
    if (res.data.code ===200) {
        return res;
    }else if (res.data.code === 404){
        router.push('/login')
    }else if(res.data.code === 10020){
        // 防止失效导致出现多个提示框的解决办法
        if(!isToken){
            isToken=true
            window.localStorage.removeItem('user')
            router.push('/login')   
            setTimeout(()=>{
                isToken=false
            },2000)
            return Message.warning(res.data.message)&&Promise.reject(res.data.message); 
        } 
    } 
},)