基本概念
- cookie:主要用来保存登录信息,比如登录某个网站市场可以看到“记住密码”这就是通过cookie中存入一段辨别用户身份的数据来实现的
- sessionStorage:会话,是可以将一部分数据在当前的会话中保存下来,刷新页面数据依旧存在。但是页面关闭时,sessionStorage中的数据就会被清空。
- localStorage:是HTML5标准找那个新加入的技术,当然早在IE6时代就有一个userData的东西用于本地存储,当时考虑到浏览器的兼容性,更通用的方案是flash,如今localStorage被大多数浏览器所支持。
localStorage
中的键值对总是以字符串的形式存储。localStorage
类似sessionStorage
,但其区别在于:存储在localStorage
的数据可以长期保留; - 补充:同源:协议相同/域名相同/端口相同
区别
- 存储大小
cookie:一般不超过4k
sessionStorage:5M甚至更多
localStorage:5M甚至更多
2. 数据有效期
cookie:一般由服务器生成,可以设置失效时间;若没有设置时间,关闭浏览器cookie失效,如果设置了时间,cookie就会存储在硬盘中,过期失效
sessionStorage:仅在当前浏览器窗口关闭之前有效,关闭页面或者浏览器会被清除
localStorage:永久有效,窗口或者浏览器关闭也会一直保存,除非手动永久删除
3. 作用域
cookie:在所有同源窗口中都是共享的
sessionStorage:在同一个浏览器窗口是共享的(不同浏览器,即使是统一页面也不共享)
localStorage:在所有同源窗口中共享
4. 通信
cookie:cookie在浏览器和服务器之间来回传递,如果使用cookie保存过多数据会造成性能问题
sessionStorage:仅在客户端(浏览器)中保存,不参与服务器的通信
localStorage:仅在客户端(浏览器)中保存,不参与服务器的通信
5. 应用场景
cookie:判断用户是否登录过网站,以便实现下次自动登录或记住密码;保存事件信息
sessionStorage:敏感账号一次性登录,单页面用的较多
localStorage:用于长期登录,适于长期保存在本地的数据