什么时候应该使用 html5 sessionStorage？

Posted 2023-03-05

【中文标题】什么时候应该使用 html5 sessionStorage？

【英文标题】：When should I use html5 sessionStorage?

【发布时间】：2012-01-19 20:47:09

【问题描述】：

我了解了sessionStorage（在会话期间保持）和localStorage（如果不删除则永久保持）之间的区别。

我可以看到localStorage 可以用作更好的cookie 版本。 （更大的尺寸，不像 cookie 那样为每个 HTTP 请求传送到服务器）。

但是对于sessionStorage，我在想我应该什么时候有效地使用它？

我考虑过用户在 pageA 中输入文本字段，然后在同一个选项卡或浏览器窗口中移动到 pageB，pageB 可以查找 sessionStorage。

除了上面的场景之外，我真的无法扩展我的猜测。谁能告诉我如何使用 sessionStorage？

【问题讨论】：

部分相关话题：***.com/questions/26556749/…***.com/questions/19867599/…***.com/questions/3259451/…

【参考方案1】：

对于 ajax 驱动的动态界面，很多时候没有存储界面外观的当前状态（例如，选择了哪个选项卡）。 sessionStorage 可以用来存储界面的状态，所以当回到一个页面时，你可以将屏幕恢复到用户看它的样子。

另一个用途是，如果您正在处理一个对象的多个页面，您可以像全局变量一样存储 id：currentInvoiceId。

每个页面所需的用户设置，例如特殊布局或模板，可以预先加载一次，然后放入sessionStorage 以便于访问。

您只希望用户在每次登录时看到一次的某些内容，例如新闻弹出窗口。您可以将他们已经看到的内容存储在sessionStorage 中。这也适用于您只希望用户每次登录执行一次的操作。

它是使用视图状态、隐藏的<input> 字段或 URL 参数在页面之间传递数据的好选择。

【讨论】：

有趣，我终于可以从 html 页面中删除那些丑陋的隐藏输入或 div 了 :)

在状态可以轻松存储在内存（javascript对象）的单页应用程序中，sessionStorage有什么用处吗？

@ThinkingStiff 在浏览器崩溃后是否保留 sessionStorage？

理论上 sessionStorage 应该在浏览器崩溃后保留，但我不记得上次 chrome 在我身上崩溃了。现在可能大多数浏览器都崩溃了。

@DevinRhode 现在我正在使用 sessionStorage 来存储我想要保留的数据，以防用户重新加载页面

【参考方案2】：

使用 sessionStorage 的主要原因是，如果您的用户要在两个不同的选项卡中打开同一个页面两次，您需要为这两个选项卡设置单独的存储区域。例如，考虑您购买机票的网站（您只能购买一张机票，例如机票流程，而不是带有购物车的案例）。如果用户尝试在两个不同的选项卡中购买两张票，您不希望这两个会话相互干扰。 sessionStorage 可让您跨多个页面加载独立跟踪这些会话。

【讨论】：

+1 喜欢你的回答，因为我觉得这很有趣。能否请您以不同的方式说明最后一行，我不明白这句话的意思。