sessionStorage、localStorage 里面保存的数据格式是 字符串

localStorage生命周期是永久，这意味着除非用户显示在浏览器提供的UI上清除localStorage信息，否则这些信息将永远存在。

sessionStorage仅在当前会话下有效，关闭页面或浏览器后被清除。

存：
    var obj = {"name":"xiaoming","age":"16"}
    localStorage.setItem("userInfo",JSON.stringify(obj));
取：
    var user = JSON.parse(localStorage.getItem("userInfo"))
删除：
    localStorage.remove("userInfo);

 

调用时:

user/login  --- 代表user文件下面的login

vuex

登录选择保存信息方式:

【黑马程序员】前端开发之Vue项目实战_Element-UI【配套源码+笔记】_哔哩哔哩_bilibili

 登录业务,通过两种方式来维持登录状态:  如何选择哪种方式:

1、通过cookie 或 session    选1 ---- 如果前端和服务器之间不存在跨域问题,推荐用

2、通过token方式    选2 ---- 如果前端和服务器之间存在跨域问题,推荐用

Chrome更新89版本后，sessionStorage丢失a标签跳转丢失sessionStorage

Chrome对于a标签默认添加了noopener属性，所以通过a标签跳转，会丢失新页面的控制权，sessionStorage自然也就丢失了，我们只需要在a标签上加上 rel="opener" 就行了。

在Chrome浏览器89版本前，当前会话页面指的是当浏览器窗口没有关闭时，窗口内同域网站可以共享此数据（同源浏览器多个窗口不共享），当页面全部关闭或窗口关闭后，sessionStorage数据会被摧毁，所以你用a标签跳转还是js跳转都会共享sessionStorage。

在2021年3月初Chrome浏览器进行了批量更新，更新到89版本后，通过a标签target="_blank"跳转到新页面时sessionStorage就会丢失。Chrome这一更新可能会导致很多网站的sessionStorage丢失。

这个问题是今天被面试官问道，面试官当时说的话大概意思是，多个网页打开的是同一个网页时，他们使用了同一个sessionStorage，某个页面关闭了，问我其他页面的sessionStorage会不会被清除！

后面去了解了，对于sessionStorage，每个页面都有自己独立保存了一份sessionStorage，就算是几个窗口打开同一个页面，每个页面的sessionStorage互不影响。
 

新窗口打开页面时,

例如: 点击新闻 ---- 新窗口打开一个页面 --- 在新窗口打开的页面里用vuex设置的state,原来的新闻页获取不到(用watch也监控不到) ---- 原因是新窗口打开的 

 

 新窗口打开页面之后,可以清掉原页面的storage ,新打开的页面里面 还会有原来设置的storage

(对于sessionStorage，每个页面都有自己独立保存了一份sessionStorage，就算是几个窗口打开同一个页面，每个页面的sessionStorage互不影响。)

 

handle(val) {
      // console.log(val, "00000000000000000000000");
      let contentId = "cxll" + val.id;
      let titleId = "cxlltitle" + val.id;
      let routerJump = this.$router.resolve({
        path: "/d",
        query: { contentId: contentId, titleId: titleId },
      });
      sessionStorage.setItem(contentId, JSON.stringify(this.str));
      sessionStorage.setItem(titleId, JSON.stringify(val.title));
      window.open(routerJump.href, "_blank");
      sessionStorage.removeItem(contentId);
      sessionStorage.removeItem(titleId);
    },