浏览器存储
提问
- 浏览器有哪些存储方式?
- 什么是 cookie ?
- 什么是 本地存储?
- 什么是 indexedDB ?
- 它们之间有什么区别?
浏览器存储技术
- 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中 | 不参与 | 不参与 | 不参与 |