Cookie，localStorage，sessionStorage

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

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

CC 4.0 BY-SA版权

文章标签：

1 篇文章

订阅专栏

本文详细介绍了Cookie与WebStorage的概念及应用。Cookie是服务器发送到浏览器并保存在本地的数据，用于记录用户会话状态和个人化设置等。WebStorage包括localStorage和sessionStorage，前者永久保存数据，后者仅在当前会话期间有效。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Cookie: 是服务器发送到用户浏览器并保存在本地的一小块数据，它会在浏览器下次向同一服务器再发起请求时被携带并发送到服务器上。通常，它用于告知服务端两个请求是否来自同一浏览器，如保持用户的登录状态。
Cookie主要用于以下三个方面：

webstorage是本地存储，存储在客户端，包括localStorage和sessionStorage。

localStorage: 生命周期是永久，除非用户显示在浏览器提供的UI上清除localStorage信息，否则这些信息将永远存在。存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存，不参与和服务器的通信。
sessionStorage: 仅在当前会话下有效，关闭页面或浏览器后被清除。存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存，不参与和服务器的通信。源生接口可以接受，亦可再次封装来对Object和Array有更好的支持。

区别：
这里写图片描述
应用：

考虑到每个 HTTP 请求都会带着 Cookie 的信息，所以 Cookie 能精简就精简，比较常用的一个应用场景就是判断用户是否登录。针对登录过的用户，服务器端会在他登录时往 Cookie 中插入一段加密过的唯一辨识单一用户的辨识码，下次只要读取这个值就可以判断当前用户是否登录。
localStorage 接替了 Cookie 管理购物车的工作，同时也能胜任其他一些工作。比如HTML5游戏通常会产生一些本地数据，localStorage 也是非常适用的。
如果遇到一些内容特别多的表单，为了优化用户体验，我们要把表单页面拆分成多个子页面，然后按步骤引导用户填写。这时候 sessionStorage 的作用就发挥出来了