cookie、localStorage、sessionStorage的区别

localStorage - 没有时间限制的数据存储

sessionStorage - 针对一个 session 的数据存储

 

共同点：sessionStorage、localStorage和cookie都由浏览器存储在本地的数据。

区别：

• cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递，localStorage和sessionStorage仅保存在客户端，不与服务器进行交互通信。
• cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据。sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。
• 存储大小限制也不同，cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据，如会话标识。localStorage 和sessionStorage，但比cookie大得多，可以达到5M或更大。
• localStorage支持事件通知机制，可以将数据更新的通知发送给监听者。 api 接口使用更方便。而cookie的原生接口不友好，需要程序员自己封装
• 作用域不同，sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。Web Storage 支持事件通知机制，可以将数据更新的通知发送给监听者。Web Storage 的 api 接口使用更方便。
• 应用场景：localStoragese：常用于长期登录（+判断用户是否已登录），适合长期保存在本地的数据。sessionStorage：敏感账号一次性登录；

localStorage提供了几个方法:

1.存储:localStorage.setItem(key,value)如果key存在时，更新value

2.获取 localStorage.getItem(key)如果key不存在返回null

3.删除 localStorage.removeItem(key)一旦删除，key对应的数据将会全部删除

4.全部清除 localStorage.clear() 使用removeItem逐个删除太麻烦，可以使用clear,执行的后果是会清除所有localStorage对象保存的数据。