先修改用户退出,中午有点困先改简单的

退出代码在src\layout\components\Navbar.vue代码如下,讲流程这里不需要修改

methods: {
toggleSideBar() {
this.$store.dispatch('app/toggleSideBar')
},
async logout() {
await this.$store.dispatch('user/logout')
this.$router.push(`/login?redirect=${this.$route.fullPath}`)
}
}

退出方法调用store\user.js的logout及resetToken,官方提供示例是post方式,abp退出是get方式请求

  logout({ commit, state, dispatch }) {
return new Promise((resolve, reject) => {
logout(state.token).then(() => {
commit('SET_TOKEN', '')
commit('SET_ROLES', [])
removeToken()
resetRouter() // reset visited views and cached views
// to fixed https://github.com/PanJiaChen/vue-element-admin/issues/2485
dispatch('tagsView/delAllViews', null, { root: true }) resolve()
}).catch(error => {
reject(error)
})
})
},

直接修改为

  logout({ commit, state }) {
return new Promise((resolve, reject) => {
removeToken()
resetRouter()
commit('RESET_STATE')
resolve()
})
},

把src\api\user.js中的logout方法访问url修改为以下代码

export function logout() {
return request({
url: '/api/account/logout',
method: 'get'
})
}

最后一步清除Token

  resetToken({ commit }) {
return new Promise(resolve => {
removeToken() // must remove token first
commit('RESET_STATE')
resolve()
})
}

测试点退出,返回登录页,并将cookie中的token清除成功

Abp Vnext3 vue-admin-template(二用户退出)的更多相关文章

  1. Vue模板语法(二)

    Vue模板语法(二) 样式绑定  class绑定 使用方式:v-bind:class="expression" expression的类型:字符串.数组.对象 1.2 style绑 ...

  2. 一步步使用SpringBoot结合Vue实现登录和用户管理功能

    前后端分离开发是当今开发的主流.本篇文章从零开始,一步步使用SpringBoot结合Vue来实现日常开发中最常见的登录功能,以及登录之后对用户的管理功能.通过这个例子,可以快速入门SpringBoot ...

  3. ECSHOP Inject PHPCode Into \library\myship.php Via \admin\template.php && \includes\cls_template.php Vul Tag_PHP_Code Execute Getshell

    目录 . 漏洞描述 . 漏洞触发条件 . 漏洞影响范围 . 漏洞代码分析 . 防御方法 . 攻防思考 1. 漏洞描述 PHP语言作为开源社区的一员,提供了各种模板引擎,如FastTemplate,Sm ...

  4. Vue小项目二手书商城:(四)详情页和购物车(emit、prop、computed)

    实现效果: 点击对应商品,对应的商品详情页出现,详情页里面还有“Add to cart”按钮和“×”退出按钮. 点击“Add to cart”可以将商品加入购物车,每件商品只能添加一次,如果把购物车的 ...

  5. flask设置cookie,设置session,模拟用户认证、模拟管理后台admin、模拟用户logout

    设置cookie HTTP协议是无状态的,在一次请求响应结束后,服务器不会留下关于客户端状态的信息.但是对于某些web程序来说,客户端的信息有必要被记住,比如用户的登录状态,这样就可以根据用户的状态来 ...

  6. 一字一句的搞懂vue-cli之vue webpack template配置

    webpack--神一样的存在.无论写了多少次,再次相见,仍是初见.有的时候开发vue项目,对尤大的vue-cli感激涕零.但是,但是,但是...不是自己的东西,真的很不想折腾.所以,我们就得深入内部 ...

  7. vue入门demo:用户管理3

    该入门demo是使用组件的方式实现,不涉及向后端发送请求 说明 把用户列表和添加用户拆分为两个组件,用户列表数据在父组件 获取用户列表:用户列表组件获取父组件的用户列表(父组件向子组件传值)1-1 1 ...

  8. vue学习笔记(二)vue的生命周期和钩子函数

    前言 通过上一章的学习,我们已经初步的了解了vue到底是什么东西,可以干什么,而这一篇博客主要介绍vue的生命周期和它常用的钩子函数,如果有学过java的园友可能有接触到在学习servlet的时候学过 ...

  9. ABP实践(4)-abp前端vue框架之简单商品增删改查(帮助刚入门的新手快速了解怎么才能加入自己的功能并运行起来)

    提示:如有不明白的地方请先查看前3篇ABP实践系列的文章 1,下载及启动abp项目前后端分离(netcore+vue) 2,修改abp数据库为mysql 3,商品系列api接口(本文主要依赖在这个商品 ...

随机推荐

  1. for,while,until三种循环

    目录 一.echo命令-改变输出字符串或者提取shell变量的值 1.1..格式 2.2.常用参数 二.for循环语句 2.1.for循环结构 示例1 示例2 三.while循环语句结构 示例1 示例 ...

  2. Python实现猜数字游戏

    Python中实现猜数字游戏代码如下: import random # 引入随机数标准库-random # 定义数字上下限和最大游戏次数 min_num = 1 max_num = 10 guess_ ...

  3. Windows服务器如何磁盘分区,Windows服务器磁盘分区常见的三种

    原文来自:https://www.sohu.com/a/272133008_100217178 我怕链接会失效,故转载此篇文章,解析得很透彻,一目了然!记录. -------------------- ...

  4. Spring Boot 入门系列(二十二)使用Swagger2构建 RESTful API文档

    前面介绍了如何Spring Boot 快速打造Restful API 接口,也介绍了如何优雅的实现 Api 版本控制,不清楚的可以看我之前的文章:https://www.cnblogs.com/zha ...

  5. PAT甲级 1112 Stucked Keyboard

    题目链接:https://pintia.cn/problem-sets/994805342720868352/problems/994805357933608960 这道题初次写的时候,思路也就是考虑 ...

  6. Linux命令(一)之目录结构、Linux终端操作、关机重启等一些基本操作

    .personSunflowerP { background: rgba(51, 153, 0, 0.66); border-bottom: 1px solid rgba(0, 102, 0, 1); ...

  7. Docker部署Mysql实践

    前言:由于Docker部署容器时,没有指定IP,当机器重启后,容器的IP会变化,所以在创建容器的时候,最好能固定IP:同时,在Ubuntu系统中,每次执行命令,都需要root权限,命令需要加sudo标 ...

  8. 为什么有些容器在docker run的时候需要接 -it ,有些不需要?

    这是我们的Dockerfile文件 FROM busybox ENV sg WANG CMD ["/bin/sh", "-c", "echo wang ...

  9. 【原创】Java内存攻击技术漫谈

    前言 Java技术栈漏洞目前业已是web安全领域的主流战场,随着IPS.RASP等防御系统的更新迭代,Java攻防交战阵地已经从磁盘升级到了内存里面. 在今年7月份上海银针安全沙龙上,我分享了< ...

  10. 树莓派远程连接工具SSH使用教程

    树莓派远程连接工具SSH使用教程 树莓派 背景故事 树莓派作为一款迷你小主机,大部分的使用场景都会用到远程调试,远程调试用到最多的方式一般就是VNC和SSH,SSH就是命令行型的远程方式,简单来说就是 ...