一、web存储

HTML5提供了web存储,可以在客户端存储一些数据,这些数据仅在客户端中保存,不参与和服务器的通信,主要分为以下两种存储:

localStorage :生命周期是永久,除非用户清除,否则这些信息将永久存在。

sessionStorage:仅在当前会话下有效,关闭浏览器后被清除。

不同浏览器无法共享sessionStorage和localStorage中的信息。

相同浏览器不同页面的localStorage可以共享(遵循同源策略,跨域的不可),但不同页面或标签页的sessionSorage无法共享。页面及标 签页仅指顶级窗口,如果一个标签页包含多个iframe标签且他们属于同源页面,那么他们之间是可以共享sessionStorage的。

 

相关API接口,sessionStorage的API与此类似
 //设置一项,这里的value是string,如果是数组或对象的需要使用JSON.stringfy()进行转换
localStorage.setItem(key, value);   

//获取 localStorage 项
let cat = localStorage.getItem(key);

//移除 localStorage 项
localStorage.removeItem(key);

//移除所有的 localStorage 项
localStorage.clear();

二、与cookie的区别

1.cookie需要参与到与服务器的通信,会携带在HTTP头中

2.cookie在过期时间之前一直有效,即使窗口关闭

 

参考https://segmentfault.com/a/1190000012057010

MDN:https://developer.mozilla.org/zh-CN/docs/Web/API/Window/localStorage