提问

1. 浏览器有哪些存储方式？
2. 什么是 cookie ？
3. 什么是 本地存储？
4. 什么是 indexedDB ?
5. 它们之间有什么区别？

浏览器存储技术

• cookie
• Web Storage
• IndexedDB

cookie

cookie 指网站为了辨别用户身份而存储在用户本地终端的数据，通常该数据经过加密。

cookie 是服务端生成的，在客户端进行维护和存储，存储在内存或磁盘中。

cookie 可以让服务器知道请求是来源哪个客户端，就可以进行客户端状态维护。比如维护用户登录态等。

cookie 使基于无状态的HTTP协议记录稳定的状态信息成为了可能。

Web Storage

Web Storage 提供了存储机制。通过该机制，，浏览器可以安全的存储键值对，比使用cookie更加直观。

Web Storage 提供了两种存储机制：

• sessionStorage: 会话级别的存储。浏览器为每一个给定的源维持了一个独立的存储区域， 该存储区域在页面会话期间可用。
• localStorage: 跟 sessionStorage同样的功能，但提供了长期存储机制， 即浏览器关闭后重新打开，数据仍然存在。

IndexedDB

IndexedDB 用于在客户端存储大量的结构化数据。

IndexedDB 是基于 javascript的面向对象数据库，允许存储和检索用键索引的对象。

特点：

• 键值对存储
• 支持事务
• 异步
• 同源限制
• 存储空间大
• 支持二进制存储

区别

特性	cookie	localStorage	sessionStorage	indexedBD
数据生命周期	一般由服务器生成，可以设置过期时间	除非被清理，否则一直存在	页面被关闭就清理	除非被清理，否则一直存在
数据存储大小	4k	5M	5M	没有限制
与服务端通信	每次都会携带在headers中	不参与	不参与	不参与