一、前端

1. 登出流程

2. 流程简述

• 1.点击登出按钮触发登出事件
• 2.调用登出后端api
• 3.后端返回
  • 3.1. 成功：删除终端缓存的用户信息和token信息
  • 3.2. 失败：提示错误信息
• 4.跳转主页

3. 源码

<view :class="{'logout':!logoutTouched, 'logout-touched': logoutTouched}" @touchstart="touchstartLogout()"@touchend="touchendLogout()"@click="logout()"style="margin-top: 20rpx;padding-left: 30rpx;padding-right: 30rpx;width: 750rpx;height: 80rpx;display: flex;flex-direction: row;justify-content: center;"><text style="color: #FFFFFF;align-self: center;font-size: 20px;">退出登录</text></view>

   logout() {var me = this;var userId = getApp().getUserInfoSession().id;var serverUrl = app.globalData.serverUrl;uni.request({method: "POST",url: serverUrl + "/passport/logout?userId=" + userId,success(result) {var status = result.data.status;if (status == 200) {// 清除终端缓存getApp().clearUserInfo();uni.reLaunch({url: "../index/index"})} else if (status != 200) {uni.showToast({title: result.data.msg,icon: "none"});}}});				}

删除缓存方法

// 清除用户信息
clearUserInfo () {uni.removeStorageSync("userInfo");uni.removeStorageSync("userToken");
}

二、后端

2.1. 登出逻辑

删除redis缓存

2.2. 源码

    @PostMapping("logout")public GraceJSONResult logout(@RequestParam String userId,HttpServletRequest request) throws Exception {// 后端只需要清除用户的token信息即可，前端也需要清除，清除本地app中的用户信息和token会话信息redis.del(REDIS_USER_TOKEN + ":" + userId);return GraceJSONResult.ok();}