我没有从窗口对象获取 beforeunload 事件

Question

我有两个功能可以呼叫和加入现有呼叫。这是功能。

  const call = ({ mode }) => {
    callWindows[id] = window.open(`/call/${mode}/${id}`, '_blank', 'width=auto, height=auto');
    callWindows[id].addEventListener('beforeunload', () => delete callWindows[id]);
    socket.emit('call', { chatId: id, mode });
  };

  const join = (chatId, data) => {
    if (callWindows[chatId]) return callWindows[chatId].focus();
    callWindows[chatId] = window.open(`/call/${data.mode}/${chatId}`, '_blank', 'width=auto, height=auto');
    return callWindows[chatId].addEventListener('beforeunload', () => delete callWindows[id]);
  };

在这两个函数中，

beforeunload

事件都没有触发。

如何修复才能获得活动？

Answer 1

beforeunload

事件非常不可靠。我建议不要依赖它。

相反，您可以通过

postMessage

实现父窗口和子窗口之间的通信，也许使用

BroadcastChannel

或仅使用

callWindow[id].postMessage

发送给子窗口并使用

opener.postMessage

发送回父窗口。如果您在关闭它的子窗口中提供一些 UI，您可以让子窗口主动向父窗口发送它正在关闭的通知，¹但您必须假设您不能依赖它。所以每当父窗口需要知道孩子是否还在的时候，可以使用

postMessage

让孩子回报。如果孩子没有反应，那就不存在了。每个子窗口都需要一个唯一的 ID，但看起来您已经有了一个。

---

¹（您也可以尝试在

beforeunload

期间发送它，只是不要指望它是可靠的。在我的测试中，它不起作用，至少在 Chromium 浏览器 [不再] 上不起作用。）