Question

我正在创建一个与.js文件结构一起使用的扩展程序：

页面A（内容脚本） - ＆gt; B（背景脚本） - ＆gt;第C页（内容脚本）

在页面A上，有链接，当点击时，向B发送消息.B的想法是打开一个新选项卡并加载页面C;当C完全加载时，它会向B发回一条消息，B会向C发送一些数据以填写表格。

这一切都有效，但是在进行了一些日志记录后，我意识到如果从页面A点击多个链接，我在B中的听众实际上会发射两次。这是代码的样子：

第A页：

$(document).ready(function () {
  $('.click-test').click(function() {
    chrome.runtime.sendMessage({formData: here}, function(response) {
    });
  });
});

B：

chrome.runtime.onMessage.addListener(

  function(request, sender, sendResponse) {
    chrome.runtime.onConnect.addListener(function(port) {
      console.assert(port.name == "formStatus");
      port.onMessage.addListener(function(msg) {
        if (msg.status == "formReady") {
            chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
              chrome.tabs.sendMessage(tabs[0].id, {formData: here}, function(response) {
                // The below is being called twice incorrectly if two links from page A are clicked
                console.log("sent message for tab ID " + tabs[0].id);
              });
            });
        }
      });
    });
    chrome.tabs.create({url: requestFormUrl});
});

第C页：

$(document).ready(function() {
  chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) {
      // Fill in form with request data    
  });
  var port = chrome.runtime.connect({name: "formStatus"});
  port.postMessage({status: "formReady"});
});

单击第A页上的第一个链接时，一切正常。单击第二个链接时，B中的onConnect侦听器将触发两次：首先使用与第一次单击相同的数据，然后使用与第二次单击相对应的正确数据。

有没有办法在一次触发后立即禁用B的侦听器？或者，我刚刚让这段代码太复杂了吗？

Answer 1

Rob W.在评论中是正确的 - 正如他在addListener部分中所做的那样删除了监听器。谢谢！

Chrome扩展程序onConnect侦听器会从不同的标签中多次触发

1 个答案: