localStorage、sessionStorage、cookie区别
-
localStorage: localStorage 的生命周期是永久的，关闭页面或浏览器之后 localStorage 中的数据也不会消失。localStorage 除非主动删除数据，否则数据永远不会消失
-
sessionStorage: sessionStorage 的生命周期是仅在当前会话下有效。sessionStorage 引入了一个“浏览器窗口”的概念，sessionStorage 是在同源的窗口中始终存在的数据。只要这个浏览器窗口没有关闭，即使刷新页面或者进入同源另一个页面，数据依然存在。但是 sessionStorage 在关闭了浏览器窗口后就会被销毁。同时独立的打开同一个窗口同一个页面，sessionStorage 也是不一样的
-
cookie: cookie生命期为只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。 存放数据大小为4K左右, 有个数限制（各浏览器不同），一般不能超过20个。缺点是不能储存大数据且不易读取
正文Cookie数据生命性：一般由服务器生成，可设置失效时间。(也可以由客户端生成)存放数据大小： 一般大小不能超过4KB作用域：Cookie的作用域仅仅由domain和path决定，与协议和端口无关与服务器端通信：浏览器每次向服务器发出请求，就会自动把当前域名下所有未过期的Cookie一同发送到服务器（会带来额外的性能开销）易用性：缺乏数据操作接口(document.cookie)。适用场景：只有那些每次请求都需要让服务器知道的信息（保持用户的登录状态），才应该放在 Cookie 里面。localStorage数据生命性：：存储在 localStorage 的数据可以长期保留；存放数据大小： 一般为5MB作用域：localStorage的作用域是限定在文档源级别的。文档源通过协议、主机名以及端口三者来确定。与服务器端通信：不会自动把数据发给服务器，仅在本地保存。易用性：有很多易用的数据操作接口，比如setItem、getItem、removeItem适用场景：常用于长期登录（+判断用户是否已登录），适合长期保存在本地的数据sessionStorage数据生命性：sessionStorage 里面的数据在页面会话结束(关闭对应浏览器标签或窗口)时会被清除。存放数据大小： 一般为5MB作用域：sessionStorage的作用域也是限定在文档源级别。但需要注意的是，如果相同文档源的页面渲染在不同的标签中，sessionStorage的数据是无法共享的。与服务器端通信：不会自动把数据发给服务器，仅在本地保存。易用性：有很多易用的数据操作接口，比如setItem、getItem、removeItem适用场景：敏感账号一次性登录；Web Storage （localStorage、sessionStorage）的优势存储空间更大更节省流量（没有额外性能开销）获取数据从本地获取会比服务器端获取快得多，所以显示更快IndexedDB（补充内容）IndexedDB 就是浏览器提供的本地数据库，它可以被网页脚本创建和操作。
IndexedDB 不属于关系型数据库（不支持 SQL 查询语句），更接近 NoSQL 数据库。
IndexedDB储存空间大,一般来说不少于 250MB，甚至没有上限。
IndexedDB不仅可以储存字符串，还可以储存二进制数据（ArrayBuffer 对象和 Blob 对象）。
提供查找接口，还能建立索引
异步操作：IndexedDB 操作时不会锁死浏览器，用户依然可以进行其他操作，这与 LocalStorage 形成对比，后者的操作是同步的。异步设计是为了防止大量数据的读写，拖慢网页的表现。
