Chrome扩展程序弹出窗口关闭时是否有事件？

Question

我已经尝试过 window.unload、window.beforeunload 等方法。 我正在寻找一种在弹出窗口关闭后通知我的后台页面的方法。

- ebi

---

你尝试过chrome.tabs.onRemoved或者如果它算作一个窗口的话，也可以尝试chrome.windows.onRemoved吗？ - BeardFist

它不算作一个窗口。 - ebi

参见：Does onbeforeunload event trigger for popup.html in a google chrome extension? - Zaz

Answer 1

你可以尝试这个。使用chrome.runtime.connect（在Chrome 26之前使用chrome.extension.connect）连接到你的背景页面，当弹出窗口关闭时，port.onDisconnect将在你的背景页面中触发。

- 方 觉

---

是的，这就是我想的，应该可以解决问题，谢谢。 - ebi

port.onDisconnect 会在插件被移除/删除时触发，而不是当用户停止使用并关闭弹出窗口时。 - Mudlabs

@Mudlabs实际上它在弹出窗口关闭时确实会触发。 - Dmitry Davydov

我也无法触发它，当弹出窗口关闭时。 - HerrimanCoder

FYI，此用例在清单v3中已经失效，因为端口将在一段时间后自动关闭，您将收到错误提示，表明您正在尝试连接一个已断开的端口对象。 - Eric Uldall

Answer 2

就是这么简单：

// popup.js
chrome.runtime.connect({ name: "popup" });

// background.js
chrome.runtime.onConnect.addListener(function(port) {
    if (port.name === "popup") {
        port.onDisconnect.addListener(function() {
           console.log("popup has been closed")
        });
    }
});

请注意，有些边缘情况下这种方法不起作用。例如，在弹出窗口打开的情况下，使用诸如Ctrl + T之类的键盘快捷方式切换选项卡时。

- gignu

Answer 3

也许这是一个不太正式的方法，但在弹出页面中，您可以监听到

  window.onblur = function(){}

并向当前标签页发送一条消息。

- nxtwrld

---

这太棒了！！ - azium

不幸的是，即使弹出窗口仍然保持打开状态，当切换应用程序时也会触发此操作，但是当通过单击扩展图标或当前选项卡来实际关闭弹出窗口时，它不会触发。 - Nick Cardoso

在Safari Web扩展中，只有这种方式有效！ - WillBC

Answer 4

目前没有办法判断浏览器操作弹出窗口何时关闭，因为 window.unonload 会在弹出窗口完成加载后立即触发，而不是在关闭时触发。有一个与此相关的 bug crbug.com/31262。

三种可用的解决方法在这里有详细描述。它们包括使用 port.onDisconnect 技巧以及从弹出窗口或后台页面定期轮询 chrome.extension.getViews() 。

- user7610

---

这是仅包含链接的答案。 - msangel

感谢您的注意，已扩展。 - user7610

Answer 5

我很惊讶没有人提到这个（我在Firefox Nightly上进行了测试，它可以工作）：

window.addEventListener("pagehide", function(event) {
    console.log(event);
 });

- Petr L.

---

在我的 Chrome 96.0.4664.110 上不起作用。我也尝试了 visibilitychange 事件，但它的效果不一致。回到 port.onDisconnect hack。 - Dmitry Davydov

Answer 6

尝试在文档对象上使用visibilitychange事件。这对我来说很有效：

document.addEventListener('visibilitychange', MyFunction, false);

- Murillo

Answer 7

这是我在应用清单V3中使用的解决方案：

在你的弹出窗口的JavaScript文件中设置一个连接。

chrome.runtime.connect();

在background.js中，使用onConnect监听事件。

chrome.runtime.onConnect.addListener(port => {
  port.onDisconnect.addListener(()=>{
    //Your event will be fired in here
  })
})

- zinzin

Answer 8

终于找到了解决方案。将以下代码放入background.js/eventPage.js中：

chrome.windows.onFocusChanged.addListener(function(window) {
    //handle close event
});

- GorvGoyl

---

任何窗口或扩展程序获得或失去焦点时都会触发此操作。这并没有回答问题。 - Joe Martella

帮助了我解决相关问题，所以我认为它至少间接相关。 - robertdavid