Chrome 扩展程序弹出窗口关闭在错误的时间触发

Chrome extension popup close fired at wrong time

本文关键字：错误 时间 程序 扩展 窗口 Chrome      更新时间：2023-09-26

我有一个chrome扩展，目前由背景页面和弹出页面组成。打开弹出窗口时会发生一些初始化。我正在使用 DOM 事件

doc.addEventListener('DOMContentLoaded', function() { ... }

而且行为是正确的。问题出在关闭弹出窗口时。由于 chrome 弹出窗口不会引发unload事件，因此我使用的是此处建议的内容。这是我的代码

弹出窗口.js

bgPage = chrome.extension.getBackgroundPage();
bgPageManager = bgPage.manager(); // This is the exposed api from bg page
bgPageManager.init(chrome.runtime.connect({
    name: 'P1'
}));

此处连接到运行时并将端口发送到后台页面，以便它可以侦听onDisconnect事件。

背景.js

function init(port) {
    port.onDisconnect.addListener(function() {
        // Clean up happens here
        stateManager.unregister();
    });
}

这也行得通。

但问题是，这onDisconnect弹出窗口打开时被触发，而不是在关闭时

触发

onDisconnect事件的文档是

允许添加和删除 Chrome 事件的侦听器的对象。

这不是每个有用的;)

那么我做错了什么，或者当我检测到弹出窗口关闭时有什么方法吗？

除非在弹出页面中有一些内容在收听chrome.runtime.onConnect（从您的评论来看，似乎并非如此），否则chrome.runtime.connect()将返回一个立即关闭的端口（因为没有人愿意听）。

不过，你肯定会让它比涉及getBackgroundPage更困难。弹出窗口可以启动端口本身。您需要做的就是：

// popup code
var bgPort = chrome.runtime.connect({name: "P1"});
// background code
var popupPort;
chrome.runtime.onConnect.addListener(function(port) {
  if(port.name == "P1") {
    popupPort = port;
    popupPort.onDisconnect.addListener(function() {
      /* Clean up happens here */
    });
  }
});

如果您想保留已有的内容，要放入弹出窗口的最小代码是这样的：

var bgPort;
chrome.runtime.onConnect.addListener(function(port) {
  if(port.name == "P1") {
    bgPort = port;
  }
});

请注意，在所有情况下，都需要在两端保留对 Port 对象的引用。如果垃圾回收器收集它，端口将断开连接。

最后，端口名称

是可选的;如果它是您使用的唯一端口，则可以删除设置/检查名称的代码。

相关文章：