前端Token存储问题
存储位置有：vuex,localStorage和sessionStorage
对比：
-
localStorage
优点：localStorage生命周期是永久，这意味着除非用户显示在浏览器提供的UI上清除localStorage信息，否则这些信息将永远存在。相同浏览器的不同页面间可以共享相同的 localStorage（页面属于相同域名和端口）。
缺点：同一个属性名的数据会被替换，不同浏览器无法共享localStorage或sessionStorage中的信息。 -
sessionStorage
优点：sessionStorage生命周期为当前窗口或标签页，sessionStorage的数据不会被其他窗口清除，页面及标签页仅指顶级窗口，如果一个标签页包含多个iframe标签且他们属于同源页面，那么他们之间是可以共享sessionStorage的。
缺点：一旦窗口或标签页被永久关闭了，那么所有通过sessionStorage存储的数据也就被清空了。 -
Vuex
优点：vuex的数据存储在内存中,保密性较高
缺点：刷新页面（这里的刷新页面指的是 --> F5刷新,属于清除内存了）时vuex存储的值会丢失
总结:也就是说,localStorage可存储持久化的数据;sessionStorage仅限于当前窗口;vuex可存储保密性较高的数据,但刷新页面后数据会被清除
token分别存储在vuex,localStorage和sessionStorage区别
- localStorage：可以持久化保存token，需要在重新登录时，清除原有的localStorage数据；但如果打开新的页面（新窗口）重新登录其他账号，会替换原有的token；
- vuex：保密性高，不会因为打开其他页面清除token，但页面刷新会清除token。
注:可以尝试在监听页面刷新前,将vuex存在localStorage,刷新后再获取并删除token - sessionStorage：在不关闭窗口的情况，可以持久化保存token，也需要在重新登录时，清除原有的sessionStorage数据；但打开新的页面（新窗口）重新登录其他账号，不会替换原有token；也不会因为刷新页面清除token
注:如果复制页面的话,两个页面会共享sessionStoage中的数据，综合上述分析：token最好是保留在sessionStorage中