存储 localStorage 和 sessionStorage

本地存储特性

1. 数据都保存在客户端，不与服务器进行交互通信
2. 设置、读取方便，刷新数据不会消失
3. 容量较大，localStorage和sessionStorage的存储数据大小一般都是：5MB
4. 只能存储字符串，可以将对象JSON.stringfy() 编码后存储，JSON.parse() 解析

localStorage

1. 生命周期永久生效，除非手动删除，否则关闭页面也会存在
2. 可以多个窗口（页面）共享数据（同一浏览器，前提是相同的域名、协议和端口号）
3. 以键值对的形式存储使用

• localStorage.setItem(key, value)
• localStorage.getItem(key)
• localStorage.removeItem(key)
• localStorage.clear(key)

sessionStorage

1. 生命周期为关闭浏览器窗口
2. 在同一窗口（页面）下数据可以共享
3. 以键值对的形式存储使用

• sessionStorage.setItem(key, value)
• sessionStorage.getItem(key)
• sessionStorage.removeItem(key)
• sessionStorage.clear(key)

webStorage的优势：

1. 相比cookie（4KB）存储容量增加
2. 可以将请求的表单数据存于本地，减少http请求，节约带宽
3. webStorage拥有易用的API

webStorage的局限性：

1. 不同浏览器webStorage 和localStorage的大小不统一。
2. 在浏览器的隐私模式下面是不可读取的
3. 本质上是对字符串的读取，因此存储内容过多时页面会变卡
4. 不能被爬虫抓取到