localStorage vs sessionStorage vs cookies答案

【问题标题】：localStorage vs sessionStorage vs cookieslocalStorage vs sessionStorage vs cookies
【发布时间】：2015-07-09 16:49:57
【问题描述】：

我正在一个应用程序中工作，我需要在用户登录期间保留一些数据，我有一个问题，它们之间有什么区别本地存储、会话存储、cookie ???

我在问我可以使用什么来将一些数据持久化在DOM中，即使用户刷新页面，有人说：使用sessionStorage，或者localStorage，然后，有人想出了使用@987654321的想法@ 因为它适用于所有浏览器，但是，我应该使用哪个？

【问题讨论】：

我认为this link 会以更广泛的方式解释这一点
另请注意，只要浏览器窗口打开（而不是设置它们的选项卡），会话 cookie 就会存在，但是一旦您关闭选项卡，sessionStorage 就会为空......

标签： angularjs html cookies local-storage session-cookies

【解决方案1】：

localStorage 和 sessionStorage 都是所谓的 WebStorages 和 HTML5 的特性。

localStorage 存储信息，只要用户不删除它们。

sessionStorage 只要会话进行就存储信息。通常直到用户关闭选项卡/浏览器。

cookies 只是简单的 cookie，它们受旧版浏览器支持，通常是使用上述 WebStorages 的框架的后备方案。

相比之下，cookie 可以存储的信息比 WebStorages 少得多，而且 WebStorages 中的信息永远不会传输到服务器。

请注意，欧盟有一项法规要求网站告知其用户有关 Cookie 的使用情况。我不知道这是否也适用于 WebStorages

【讨论】：

你推荐我用什么？我需要保留的数据只是 DOM 中的用户名和电子邮件。不是需要完全安全的应用程序。
视情况而定，如果您需要支持旧浏览器（HTML5 之前），则需要 cookie。否则我个人会使用存储（如果您需要“永久”数据，则为 localStorage，否则为 sessionStorage），因为我喜欢使用新功能；）
“我不知道这是否也适用于 WebStorages”——确实如此。 ico.org.uk/for-organisations/guide-to-pecr/…
欧盟法规仅在 cookie/存储不是您服务的重要组成部分时才需要同意。用于广告的 Cookie 需要征得同意，用于登录表单或购物车的 Cookie 不需要征得同意（请参阅 Quentin 的链接进行说明）。

【解决方案2】：

sessionStorage 对象： sessionStorage 对象仅为会话存储数据，这意味着数据将一直存储到浏览器（或选项卡）关闭为止。本地运行文件时不可用。

存储在 sessionStorage 对象中的数据只能从最初存储数据的页面访问；所以这不符合您的要求

localStorage 对象： 使用 localStorage 对象存储的数据会一直保留，直到通过 JavaScript 明确删除或用户清除浏览器的缓存。

存储在 localStorage 对象中的数据只能从最初存储数据的域访问。

对于您的情况，我认为您考虑使用 cookie 或会话，请。请注意，每个服务器的 cookie 大小限制为 4K。

【讨论】：

我不认为你第二次提到的关于 sessionStorage 的内容是正确的，至少不是在 Angular 的上下文中。根据规范，每个 sessionStorage 都与顶级浏览上下文相关联，这对于 Angular 应用程序中的每个页面都是相同的。
我只需要保留用户信息，例如电子邮件、用户名，也许还有一张图片，是否足以使用 4K 会话或 cookie？
把邮箱和用户名放在cookies里应该没问题，我觉得你不需要保存图片

【解决方案3】：

除了其他答案，WebStorages 无法访问子域和/或父域。

【讨论】：

【解决方案4】：

Cookies 只是保存 4kbs 数据和到期时间。

localStorage 是永久 cookie 保存 4 MB 数据，当用户清除缓存时它将删除

【讨论】：

【解决方案5】：

本地存储： 1. 数据限制：5 MB 2.每个http请求发送的数据：没有

会话存储： 1. 数据限制：5 MB 2.每个http请求发送的数据：否 3. 关闭窗口或标签页后数据将被清除

我会说，如果数据不敏感，则使用 localstorage/sessionStorage，否则使用 cookie

【讨论】：

【解决方案6】：

LocalStorage - 存储没有过期日期的数据，并且只能通过 JavaScript 或清除浏览器缓存/本地存储的数据来清除。存储限制是三个中的最大值

SessionStorage - sessionStorage 对象仅存储会话的数据，这意味着数据会一直存储到浏览器（或选项卡）关闭为止。数据永远不会传输到服务器。存储限制大于 cookie（至少 5MB）。

Cookie - 存储必须通过后续请求发送回服务器的数据。它的过期时间因类型而异，过期时间可以从服务器端或客户端（通常从服务器端）设置。 Cookies主要用于服务器端读取（也可以在客户端读取），localStorage和sessionStorage只能在客户端读取。大小必须小于 4KB。可以通过将 cookie 的 httpOnly 标志设置为 true 来确保 cookie 的安全。这可以防止客户端访问该 cookie。

【讨论】：