Chrome擴展程序彈出窗口在錯誤的時間觸發

Question

我有一個chrome擴展程序，該擴展程序當前由一個背景頁面和一個彈出頁面組成。 打開彈出窗口時會發生一些初始化。 我正在使用DOM事件

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

並且行為是正確的。 問題是關閉彈出窗口時。 由於chrome彈出窗口不會引發unload事件，因此我使用此處建議的內容。 這是我的代碼

popup.js

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

在這里，連接到運行時並將端口發送到后台頁面，以便它可以偵聽onDisconnect事件。

Background.js

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

這也可以。

但是問題是， 打開彈出窗口時（而不是關閉窗口時）會觸發此onDisconnect

onDisconnect事件的文檔是

一個對象，允許添加和刪除Chrome事件的偵聽器。

並不是每個都有幫助；）

那么，我在做任何錯誤的事情，還是可以檢測到彈出窗口關閉的任何方式？

Answer 1

除非彈出窗口中有人監聽chrome.runtime.onConnect （根據您的評論，似乎並非如此）， chrome.runtime.connect()將返回一個立即關閉的Port（因為沒人願意聽） 。

但是，與使用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對象的引用。 如果垃圾收集器對其進行收集，則端口將斷開連接。

最后，端口名稱是可選的。 如果這是您使用的唯一端口，則可以刪除設置/檢查名稱的代碼。