以下从 3 个方面进行比较:
1, 容量: cookie 只有 4KB,localStorage 和 sessionStorage 最大容量 5M
2, 是否会携带到 ajax 中: cookie 由每个对服务器的请求来传递, 会影响获取资源的效率, localStorage 和 sessionStorage 只有在请求时使用数据. 它使在不影响网站性能的情况下存储大量数据成为可能.
3,API 易用性: cookie 需要封装才能使用, localStorage 和 sessionStorage 简单易用
html5 专门为存储而设计提供了两种在客户端存储数据的新方法: localStorage 和 sessionStorage
localStorage - 没有时间限制的数据存储, 第二天, 第二周或下一年之后, 数据依然可用.
sessionStorage - 针对一个 session 的数据存储, 当用户关闭浏览器窗口后, 数据会被删除.
最大容量 5M, 数据不是由每个服务器请求传递的, 而是只有在请求时使用数据. 它使在不影响网站性能的情况下存储大量数据成为可能.
对于不同的网站, 数据存储于不同的区域, 并且一个网站只能访问其自身的数据.
HTML5 使用 JavaScript 来存储和访问数据.
API 简单易用
- localStorage.setItem(key,value)
- localStorage.getItem(key)
注意:
ios safari 隐藏模式 (隐私模式) 下
localStorage 和 sessionStroage 会报错
建议统一使用 try-catch 封装
cookie
本身用于客户端和服务端通信但它有本地存储的功能, 于是被 "借用"
cookie 用于存储的缺点
存储量太小, 只有 4KB
所有 http 请求都带着, 会影响获取资源的效率
API 需要封装才能用 document.cookie = ... 具体可参考其他链接: https://www.cnblogs.com/kaixin3946/p/6042014.html
来源: http://www.bubuko.com/infodetail-2570718.html