Javascript 未触发卸载前的窗口事件

我有一段代码，它在本地存储中存储一个布尔标志，以指示浏览器选项卡中是否已经打开了web应用程序的实例

我依靠事件来确保在用户关闭选项卡时清除本地存储标志

Sudo代码：

if (!isOneTabOpen) {
    localStorage.setItem(isOpenTabKey, 'true');

    window.addEventListener(
      'beforeunload',
      () => {
        localStorage.removeItem(isOpenTabKey);
      },
      false,
    );
  } else {
    window.alert(
      'One more page is open',
    );
    window.location.replace('about:blank');
  }

上个月，我的网站的用户抱怨他们不能再打开网站了，他们看到警告说“还有一个页面打开了”，即使他们没有打开网站

我尝试了不同的方法使Chrome崩溃，但我从未尝试过让localStorage保持

isOpenTabKey

设置的状态

---

是否有任何已知的情况下，

beforeunload

事件不会触发，因此我的本地存储处于损坏状态，可能导致此问题？

我认为onbeforeunload规范最近已悄然更改。让我们检查一下应该有效的基本示例

window.onbeforeunload = function(e) {
  alert('test');
  console.log('test')
  e.returnValue = 'test';
  return 'test';
};

这段简单的代码处理onbeforeunload事件。例如，它在最新的chrome中的表现

• 它显示浏览器默认的离开网站的消息，带有带有“离开”和“取消”按钮的确认框
• 执行console.log
• 阻止javascript执行的警报、提示和其他内容将自动被阻止
我也观察到，如果我们打开一个带有上面代码的页面，并且不会与页面关闭标签进行任何交互，那么在没有任何消息的情况下是可能的，当我们点击任何空白点时，情况就会发生变化，在这种情况下，默认的确认框将会出现，控制台日志将被显示。

我认为您的问题可能是由于事件侦听器不总是附加。它当前是有条件地附加的，让我们在beforeunload函数中生成if语句，并在函数中进行适当的检查

window.addEventListener(
  'beforeunload',
  () => {
     if (!isOneTabOpen) {
         // do loacal store stuff
     }
  },
  false,
);

---

它将确保您的处理程序始终处于连接状态，并且如果某些部分执行或未执行，您可以进行更多的调试，chrome会阻止警报，因此它们不是卸载调试之前进行处理的好方法。

这只会发生在chrome上吗？@Armel它发生在chrome上是的，我不知道其他浏览器中是否存在此问题。