Firefox WebExtension：检查扩展是否已经存在

Question

我正在将我的 Chrome 扩展移植到 Firefox WebExtension，到目前为止一切顺利，我设法与我的内容、后台脚本和我的可执行文件进行顺畅的通信。

我现在想检查我的扩展程序是否存在。这实际上是我的做法：

Browser script

// browser-script.js

var isExtensionHere = false;

$("#is-extension-here").click(function(){

    console.log("Check the existence of the extension");

    window.postMessage({
        direction: "from-page-script",
        message: "areYouThere"
      }, "*");
});

window.addEventListener("message", function(event) {
  if (event.source == window &&
      event.data.direction &&
      event.data.direction == "from-content-script") {
        if(event.data.message == "OK") {
            isExtensionHere = true;
        }
  }
});

Content Script

// content-script.js

window.addEventListener("message", function(event) {
  if (event.source == window &&
      event.data.direction &&
      event.data.direction == "from-page-script") {

    if(event.data.message == "areYouThere") {
        window.postMessage({
        direction: "from-content-script",
        message: "OK"
      }, "*");
    }
  }
});

当扩展在这里时它工作正常。但如果不是，显然我没有从我的分机中得到答案。当扩展程序不在此处时，我怎么知道如何触发弹出窗口或消息？

Answer 1

您可以反转逻辑：让页面监听来自扩展程序的 ping。您需要注意脚本何时执行（例如，取决于 run_at 参数）彼此之间的关系，以免在页面开始收听之前不小心发送消息。
您可以使用另一种方法来通知页面存在：内容脚本可以添加一个具有已知 ID 的不可见 DOM 元素，您可以从页面检查它是否存在.

如果你想保持当前的方法，你可以为响应设置一个定时器。比如说，200 毫秒应该绰绰有余。

您可以将其实现为一个 Promise，因为它只能被解决一次：

var isExtensionHere = new Promise((resolve, reject) => {
  const listener = (event) => {
    if (
      event.source == window && event.data.direction
      && event.data.direction == "from-content-script"
      && event.data.message == "OK"
    ) {
      resolve(true);
    }
  }

  setTimeout(() => {
    window.removeEventListener("message", listener);
    resolve(false); // Will have no effect if already called with true
  }, 200);

  window.addEventListener("message", listener);

  window.postMessage({
    direction: "from-page-script",
    message: "areYouThere"
  }, "*");
});

// Sometime later
isExtensionHere.then((result) => { /* ... */ });

如果你想动态地重新检查，使isExtensionHere一个函数，每次returns一个新的Promise。

Firefox WebExtension：检查扩展是否已经存在

Firefox WebExtension : check if extension already exists

javascript

firefox-addon-webextensions