cookies:
浏览器缓存
在HTML5标准前本地存储的主要方式。
cookie由名称(一个唯一确定cookie的名称)、值(储存在cookie中的字符串值)、域(cookie对于哪个域是有效的)、路径(指定域中的指定路径)、失效时间(cookie何时应该被删除的事件)和安全指标(指定后,cookie只有在使用SSL连接时才发送到服务器)构成。
优点:兼容性好,请求头自带cookie方便。
缺点: 保存在客户端,存储量小受到限制,所有cookie的累加长度限制在4KB,超长会被忽略;自动请求头加入cookie浪费流量,每个domain(层)限制20个cookie,使用起来麻烦,需要自行封装;
设置过期时间自动删除,前后端自动同步。
localStorage:
本地存储
HTML5加入的以键值对(Key:Value)为标准的方式。
优点: 操作方便,存储的数据没有过期时间(永久性存储,除非手动删除),大小为5M,兼容IE8+。
sessionStorage:
临时存储
和localStorage基本类似,存储的数据会在浏览器会话结束时被清除(即页面/浏览器关闭时)。⽽且与 cookie、localStorage 不同,他不能在所有同源窗⼝中共享,是会话级别的储存⽅式;
Web SQL:
数据库存储
· 2010 年被 W3C 废弃的本地数据库数据存储⽅案,但是主流浏览器(⽕狐除外)都已经有了相关的实现,web sql 类似于 SQLite,是真正意义上的关系型数据库,⽤sql进⾏操作,当我们用JavaScript时要进⾏转换,较为繁琐。
IndexedDB:
数据库存储
是被正式纳⼊HTML5 标准的数据库储存⽅案,它是 NoSQL数据库,⽤键值对进⾏储存,可以进⾏快速读取操作,⾮常适合 web场景,同时⽤JavaScript 进⾏操作会⾮常便。