为什么 Edge 中的 sessionStorage 与 Firefox/Chrome 不同，我该如何更改？

Question

在 Microsoft Edge 中，当我右键单击链接并使用“在新选项卡中打开”选项时，我可以看到/访问在初始页面中创建的 sessionStorage 值。但是，Chrome 和 Firefox 浏览器不存在此问题。你可以在这个JSFiddle看到这个问题。

1. 打开 JS Fiddle 链接（在 Edge 中）
2. 输入任何文本。观察输入的文本显示在输出部分文本字段项中
3. 右键单击“运行”按钮并选择“在新选项卡中打开”。可以在此新选项卡中访问在另一个浏览器选项卡中的上一步中输入的文本。根据documentation sessionStorage 是为每个选项卡创建的，它是选项卡私有的。

如果您在 Chrome 或 Firefox 中重复这些步骤，您将不会看到此问题。为什么 Edge 浏览器中的 sessionStorage 与 Firefox 和 chrome 等其他浏览器的行为不同？在 Edge 浏览器中是否有解决此问题的方法？

<span>Your Name is</span>&nbsp;<input type="text" id="name"/>

(function() {
// check value exists or not in session storage
if (sessionStorage.getItem("username") == null || sessionStorage.getItem("username") == undefined)
{
   vUserName = prompt("Enter your name");
   sessionStorage.setItem("username", vUserName);
}

document.getElementById("name").value = sessionStorage.getItem("username");
})();

Answer 1

原因是：

sessionStorage.getItem("username") == null // false

相反，您应该使用：

sessionStorage.removeItem("username")

现在调用 getItem 将导致返回值为 null，而不是“null”。

Answer 2

从doc，它说在新选项卡或窗口中打开页面会创建一个具有顶级浏览上下文值的新会话。因此，我认为通过右键单击链接并使用“在新选项卡中打开”选项打开的页面应该从前一页继承 sessionStorage。也可以参考this thread的答案，我觉得有道理。

此外，还有人认为 Chrome 是 an issue。所以我认为这是不同浏览器设计的不同行为。解决方法也可以参考this thread。