html - 如何结合localStorage和sessionStorage的优势

Question

我想在建议使用 HTML5 localStorage 的浏览器选项卡之间共享我的身份验证 token .但是我不希望在浏览器关闭时将与身份验证相关的任何内容保留在我的存储中，这建议使用 HTML5 sessionStorage .

Reference 1 related to this topic (click) :

That means that you can't share between tabs, for this you should use localStorage

Reference 2 related to this topic (click) :

Therefore, it's recommended not to store any sensitive information in local storage

我如何结合选项卡之间身份验证 token 的共享，并仍然确保当浏览器关闭时没有任何东西留在存储中？

其他网站是如何解决这个看似简单的问题的。

Answer 1

我们使用 cookie。

存储有其用途。但是cookies满足您的所有要求。

• Cookie 在所有同源标签页之间共享。您甚至可以指定它们的路径，但默认情况下它们是共享的。

• Cookies会在浏览器关闭时自动删除，您什么都不用做；这又是默认行为。

• 可以很容易地使 Cookie 与存储一样安全或更安全。

有时最好的解决方案是最简单的解决方案。无需重新发明轮子。

Cookie 安全

session cookie 像 sessionStorage 一样存储在磁盘上(以防浏览器崩溃并需要恢复)。因此，它们在本地磁盘读/写方面的安全性大致相同。

在http传输过程中，cookie和存储处理脚本都可能被获取甚至窃取，所以您必须在这两种情况下都使用 HTTPS。(这是 the least 你应该做的。)

Cookie 可以配置为 HTTP only ,阻止 JavaScript 访问它，从而免疫 XSS script和 greasemonkey hijacking .

以防身份验证 token 被盗，我们还将每个 token 与机器的用户代理和 ip 相关联。这可以防止 token 被来自外部网络的人使用。如果你愿意，你可以添加更多content negotiation混合标题 - 并非所有机器人都复制所有标题。

为了另一个安全级别，您可以添加 client side fingerprinting .这些指纹必须在客户端捕获并通过网络传输，因此它们不是防弹的，但它们会迫使内部攻击者(与用户在同一网络上的攻击者)跳过另一个圈套。

此时，他们通常会切换到easier attacks在你的控制之外。