当前位置:首页 > 技术分析 > 正文内容

vue-admin-template处理token失效

ruisui8818小时前技术分析1


token失效后应该删除token使其跳转至登录页面,而不是报401错误。

1.在request.js的拦截器的位置添加401的判断,在此进行token的删除和跳转

跳转要导入路由

import { router } from '@/router'

async(error) => {
    if (error.response.status == 401) {
    Message({ type: 'warning', message: 'token 超时了' })
    // 说明token超时了
    await store.dispatch('user/logout') // 相当于调用action退出登陆
    router.push('/login') // 跳转到登录页
    }
    Message({ type: 'info', message: error.message })
    return Promise.reject(error)
    }

2.在store/user.js添加token删除action logout


logout(context) {
    context.commit("removeToken") // 删除token
    context.commit("setUserInfo",{}) // 设置用户信息为空
}


添加removeToken mutations

removeToken(state) {

    // 删除vuex的token

    state.token = null

    removeToken()

},

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/3787.html

分享给朋友:

“vue-admin-template处理token失效” 的相关文章

vue:组件中之间的传值

一、父子组件之间的传值----props/$emit1、父组件向子组件传值--props2.子组件想父组件传值-this.$emit('select',item)二、父组件向下(深层)子组件传值----provide/injectprovide:Object | () => O...

gitlab 分支保护设置

一、功能描述代码管理中管理,我们把稳定的分支设置为保护,可以防止其他人员误操作(例如删除,合并,推送代码等)。二、Gitlab配置步骤1 点击项目Repository标签2.点击Expand标签3.配置如下:默认master是被保护的,而且只有维护人员具有推送和合并权限。设置保护分支,这里的beta...

git的几种分支模式

编写代码,是软件开发交付过程的起点,发布上线,是开发工作完成的终点。代码分支模式贯穿了开发、集成和发布的整个过程,是工程师们最亲切的小伙伴。那如何根据自身的业务特点和团队规模来选择适合的分支模式呢?本文分享几种主流 Git 分支模式的流程及特点,并给出选择建议。分支的目的是隔离,但多一个分支也意味着...

java调用API操作GitLab

最近需要在一个WEB项目中集成GitLab,用到了GitLab的API操作,在网上找了很久都是说直接调用GitLab的Http接口,而且API官方只有javadoc没有其它说明文档,特别记录下,以备查询。这里采用Token的认证方式,因此需要先登陆GitLab新建一个Token,创建方式如下:创建完...

VIM配置整理

一、基本配色set number set showcmd set incsearch set expandtab set showcmd set history=400 set autoread set ffs=unix,mac,dos set hlsearch set shiftwidth=2 s...

学前端,这30个CSS选择器,你必须熟记

你学会了基本的id,class类选择器和descendant后代选择器,然后就觉得完事了吗?如果这样,你就会错过许多灵活运用CSS的机会。虽然本文提到的许多选择器都属于CSS3,并且只能在现代的浏览器中使用,但学会这些是大有好处的。什么是CSS选择器呢?每一条css样式定义由两部分组成,形式如下:[...