浏览器端存储数据的用途很广泛,比如在保存用户信息、存储个性化设置信息、保存某种状态或是资料等方面都会用到。
其中方法主要有三种:cookie、sessionStorage、localStorage。下面主要讨论一下我在学习过程中发现这三者的区别。
1.是否与服务器端交互:
cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递;
而sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。
2.存储大小限制:
cookie存储的数据不能超过4k,同时因为每次http请求都会携带cookie,所以cookie只适合保存很小的数据,比如会话标识;
sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大。
3.数据有效期不同:
sessionStorage仅在当前浏览器窗口关闭或刷新前有效,需要持久保存的数据自然也就不可能使用sessionStorage;
localStorage保存数据始终有效,窗口或浏览器关闭也一直保存,因此可用作持久保存数据;
cookie只在开发人员设置的有效期时间之前一直有效,即使窗口或浏览器关闭。
4.作用域不同:
sessionStorage在不同的浏览器窗口中不能共享,即使是同源页面;
localStorage 在所有浏览器的同源窗口中都是共享的;
cookie也是在所有同源窗口中都是共享的。