Cookies、Session、本地存储

大家好，我们将快速概述浏览器中存储数据的三种主要方式：会话存储、本地存储和 Cookie。让我们看看它们的异同，以及何时使用哪种存储方式。

第一个关键的相似之处是，这三个属性都存储在客户端或用户的浏览器中，并且仅存储在该用户的浏览器中。Cookie、本地存储和会话存储在同一台计算机的其他浏览器中不可用，因此它们独立于浏览器。它们旨在在浏览器和服务器之间交换信息。其中包含的信息通常是先前的交互或特定于用户的规范。本地存储和会话存储可以被视为同一类别，因为它们在交互方式上非常相似，仅在少数情况下有所不同。Cookie 的行为几乎与其他两者完全不同，并且存在的时间也更长。

图片来自 FreeCodeCamp

容量

Cookie 与本地存储和会话存储的一个区别在于容量大小。Cookie 只能存储少量信息；大多数浏览器的 Cookie 容量为 4 KB，而本地存储和会话存储分别可以容纳 10 KB 和 5 KB。这意味着 Cookie 会比本地存储和会话存储小得多，但就它们的使用场景而言，这完全没问题。

浏览器支持

由于 HTML 4 已经存在很长时间了，所以支持 HTML 4 的旧浏览器也支持 Cookie，但这并不是您真正需要担心的事情，因为现在几乎所有浏览器都支持 HTML 5。

可访问性

Cookie 和本地存储可用于浏览器内的任何窗口，因此如果您在一个选项卡或另一个选项卡上打开 Google Chrome，则 Cookie 将在您打开的该网站的所有不同选项卡上可用，而例如，部分存储仅在您打开的单个选项卡中可用，因此如果他们打开另一个选项卡并转到您的网站，它将不可用。

到期

这就是本地存储和会话存储真正不同的地方。

会话存储仅用于单次浏览会话，因此得名。一旦用户关闭设置该会话的标签页，会话存储就会被删除；而本地存储则会永久存在，直到用户最终删除它，或者网站代码被设定为在特定操作后删除它。

对于 Cookie，其到期日期是在发送给客户端时声明的，并且由开发人员设置到期日期，该到期日期始终在 Cookie 上声明。到期日期通常设置为非常遥远的未来日期，目的是让它永远保留在浏览器中。通常，这些日期是 9999 年 12 月 31 日，这是允许设置的最远日期，因此请注意，您浏览器中的任何 Cookie 都可能在公元 10,000 年元旦到期。Cookie 需要到期的另一个原因是用户执行了某个操作或在某个时间范围内做了某事。其中一个例子就是对《华尔街日报》等在线新闻网站设置的每月免费文章限制。

但是，Cookie 也可以不指定过期属性。未指定过期日期的 Cookie 将在浏览器关闭时过期，类似于会话存储的过期。这种类型的 Cookie 称为会话 Cookie，因为它们在浏览器会话结束后会被删除。会话 Cookie 的一个主要用途是允许访问者在网站页面之间访问时被识别或验证身份。会话 Cookie 功能的另一个用途是电子商务网站上的购物车功能，当您在网站上逐个页面浏览时，购物车中会填充您的商品。

存储位置

至于存储位置，本地存储和会话存储都在浏览器上，就像我之前说的，但是 cookie 虽然存储在浏览器中，但每当用户向服务器请求某些内容时，它们就会被发送到该服务器。无论是图像、HTML 文件、CSS 文件还是作为服务器响应发送的任何内容，cookie 都会与客户端的请求一起发送。这就是它们的容量小得多的原因。因为 cookie 中的所有信息都会发送到服务器，所以如果你有很多非常大的 cookie，它会减慢你对服务器的请求和它发回的响应的速度。虽然 cookie 的最大大小只有 4KB，但当考虑到服务器在给定的时间内处理数以万计的请求的大型应用程序时，可以想象通过 cookie 发送的数据量。

这就是为什么最佳实践要求发送和转发的 cookie 尽可能小且尽可能有限，这样你就不会减慢请求的速度

Cookies 对于执行某些与身份验证相关的任务也非常有用，它们通过 HTTP 标头从浏览器发送到服务器，而不像本地存储或会话存储那样仅由应用程序作为客户端数据存储进行访问。

总而言之，如果您要在用户浏览器中存储某些内容，则几乎总是需要使用本地存储或会话存储，具体取决于您希望它在客户端保留多长时间。无论您是希望它只保留一个会话（会话存储），还是希望它在用户关闭浏览器后仍然保留（本地存储）。