cookie，localStorage，sessionStorage

最新推荐文章于 2025-06-29 16:13:03 发布

原创最新推荐文章于 2025-06-29 16:13:03 发布 · 373 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

js 专栏收录该内容

5 篇文章

订阅专栏

本文详细介绍了前端存储技术，包括cookie、localStorage和sessionStorage的特点及使用方法。对比了它们之间的存储容量、生命周期等关键特性，帮助开发者更好地选择合适的前端存储方案。

!本地存储
cookie不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不高。
localStorage - 没有时间限制的数据存储
sessionStorage - 针对一个 session 的数据存储

document.cookie="xx=xxxx";第二次无参数，即时性

localStorage.xx="";生命周期永远
localStorage.setItem("age",18);添加
localStorage.getItem("age");获取
localStorage.age获取
localStorage.removeItem("age");删除
localStorage.clear();清空数据

sessionStorage方法与localStorage方法都一样
区别sessionStorage生命周期是session

cookie存储大小只有4KB，有的浏览器只能存储20条，超出会覆盖，不适合大量的数据存储
sessionStorage和localStorage存储空间5MB，不会发送到服务端
除session会话保持在服务端，其余以上三个保持到客户端