localStorage、sessionStorage、cookie的区别

一些废话前言：在一次会上，后端说存在 localStorage 里的数据在关闭浏览器后就被清除了，问我是不是这样。我说是手动清除。另一个前端就对我说关闭浏览器是会被清除的。然后，我就开始怀疑自己的记忆了。我记得localStorage是手动删除或者在代码里写删除时机进行删除，sessionStorage才是会话级存储，关闭浏览器就清除数据啊……于是我重新看了一下这三种存储的区别，整理出来，以作记录。

cookie：最初用于服务器通信（如身份验证），每次HTTP请求自动携带，发送到服务器。

localStorage：HTML5引入的持久化本地存储，，仅客户端，不参与通信，用于长期保存客户端数据。

sessionStorage：临时存储，仅客户端存储，不参与通信，仅用于单次会话期间的数据。

比较项	cookie	localStorage	sessionStorage
存储容量	≤ 4KB	约等于5MB 1兆字节（MB）=1024千字节（KB）	约等于5MB
生命周期	设置过期日期，过期后自动失效，或手动清除浏览器cookie	手动清除浏览器缓存删除，或通过代码设置过期时间删除	标签页关闭则自动清除
兼容性	历史支持	在一些低版本浏览器中不支持	在一些低版本浏览器中不支持
安全性	不安全，但支持HttpOnly（防JS访问）安全属性	不安全，无内置安全机制	不安全，无内置安全机制
应用场景	非敏感信息，如几天免登录、会话标识	长期缓存，如登录状态、用户偏好设置	临时数据，如表单的临时数据