VUE实现浏览器网站同时登录两个账号

背景

公司正在开发的项目中，目前提出了一个需求，账号通过登录之后，在系统内部客户列表页面点击登录获取token，跳转链接打开新窗口或标签页。此时，两个窗口的账号信息独立，互不影响。在我刚拿到这个需求，第一反应是不可能的，这就等同于说一个游戏同时登录两个账号且不被顶号，但是在研究之后实现了这个功能，因此记录一下此次功能实现过程。

踩坑

首先，web端网站的账号信息一般就是存在cookie、localStorage、sessionStorage中的，其中前两个存储都是同域名下同浏览器一致的，不管怎么打开新的标签页，新的窗口，都是一直的。于是想在sessionStorage中存储token，实现不同标签页存储不同的token，请求时取当前sessionStorage中的值。

但是，sessionStorage的机制是，手动打开的新标签页或新窗口，sessionStorage是独立的，但是通过点击跳转链接打开的却是和原来的sessionStorage是一致的，因此这个方案无效。

解决方案

客户登录链接跳转时打开新窗口时不更换token，而是在localStorage中存储一个备用的token；

        Persistent.setLocal('secondInfo', JSON.stringify(data), true, 30 * 60 * 1000