需求

同一个浏览器两个tab分别登录A和B两个账号

问题描述

用户登录会在缓存中存token，键名都是一样的，所以会出现A用户登录，后在另外一个tab里登录B用户，A用户再访问接口的时候，其实是用的B用户的token，因为每个用户的权限不一样，这样就照成了bug

解决思路

让不同的用户存储的token的键名不一样

实现方法

• 在登录的时候存储用TOKEN+userName作为键来存储token

import Cookies from 'js-cookie'
import Config from '@/config'
const TokenKey = Config.TokenKey;

export function getToken() {
  return Cookies.get( TokenKey + sessionStorage.getItem( 'username' ) )
}

export function setToken( token, rememberMe, username ) {
  if ( rememberMe ) {
    return Cookies.set( TokenKey + username, token, { expires: Config.tokenCookieExpires } )
  } else {
    return Cookies.set( TokenKey + username, token )
  }
}

export function removeToken( username ) {
  return Cookies.remove( TokenKey + username )
}

• 页面刷新前存储用户名

    window.addEventListener("beforeunload", () => {
      sessionStorage.setItem("username", this.user.username || "");
    });