Question

我的popup.js中有以下代码：

function setDomain(domain) {      
   $.ajax({
        url: "http://example.com/api/" + domain,
        type: "GET",
        success: function (returnedData) {
          //do sth with returnedData
        }
   })
}


chrome.runtime.onMessage.addListener(
  function requestEvents(request, sender, sendResponse) {

    if (request.task==="showPopup"){
         chrome.tabs.query({active: true, currentWindow: true}, function (tabs) {
         chrome.tabs.sendMessage(tabs[0].id, {from: 'popup', subject: 'domainName'}, setDomain);});
    }
  }
);

当用户打开多个标签时，当用户决定点击浏览器操作时，这会导致多个addListener事件。

background.js看起来像这样：

chrome.browserAction.onClicked.addListener(function(){
  chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
    chrome.runtime.sendMessage({task: "showPopup"});
  })
});

我尝试了很多东西但是还没有能够让它正常工作。我尝试使用hasListener和removeListener，如下所述：https://developer.chrome.com/apps/events但无法使其工作。我不确定应该如何使用removeListener。我在函数requestEvents的末尾添加了（在popup.js中），但它似乎没有删除监听器。也不知道如何检查当前附加的侦听器。

打开多个标签时，如何防止添加多个侦听器？

编辑：在content.js中我有：

chrome.runtime.onMessage.addListener(function (msg, sender, response) {
  if ((msg.from === 'popup') && (msg.subject === 'domainName')) {
    var domainName = document.domain;
    domainName = extractDomain(domainName)
    response(domainName)
  }
}

var iframe = document.createElement('iframe');
iframe.id="iframe-pl"
iframe.frameBorder = "none";
iframe.src = chrome.extension.getURL("popup.html")

从上面的代码可以看出，我将popup.html注入了一个网站。

popup.html看起来像这样

<!DOCTYPE html>
<html>
  <head>
    <script type="text/javascript" src="popup.js"></script>
    <script type="text/javascript" src="jquery-3.2.0.min.js"></script>
    <link href="stylesheets/stylesheet.css" rel="stylesheet">
    <link href="stylesheets/font-awesome-4.7.0/css/font-awesome.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Ubuntu|Hind|Varela|Lato:300,400,500,600,700,900", rel="stylesheet", type="text/css">
  </head>
  <body>
  <div class="title white">
    ...

所以问题是如何在打开多个标签时阻止添加多个侦听器？任何答案都将不胜感激......

Answer 1

你有 background.js ：

chrome.browserAction.onClicked.addListener(function(){
  chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
    chrome.runtime.sendMessage({task: "showPopup"});
  })
});

这将查询活动选项卡，但向所有侦听器发送消息。根据{{3}}：

如果发送到您的扩展，runtime.onMessage事件将是在你的分机的每一帧都被解雇（发件人的框架除外）

尝试将chrome.runtime.sendMessage({task: "showPopup"});替换为chrome.tabs.sendMessage(tabs[0].id,{task: "showPopup"})，将邮件仅发送到有效标签。

除此之外，每个网页包含2个消息监听器：content.js中的一个（我假设是内容脚本）和popup.js中的另一个，当您插入{{1}时加载在网页中的iframe中。

如何防止Chrome扩展程序添加多个侦听器

1 个答案: