Question

在我的代码中，我目前有一个内容脚本，它将消息发送到后台脚本，并作为响应创建一个警报。访问example.js时，这适用于background.js和https://www.google.com。但是，在尝试在popup.js和我的内容脚本之间建立通信时，我收到错误消息

Could not establish connection. Receiving end does not exist.

我目前拥有的是一旦点击弹出窗口上的按钮，我就会从popup.js发送消息。然后，应该从内容脚本example.js显示控制台消息，但它似乎甚至没有到达内容脚本的监听器。这是代码，

popup.js：

window.onload=function(){
    document.getElementById('highlight').addEventListener('click', sendHighlightMessage, false);
}

function sendHighlightMessage() {
  chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
    console.log("going through tabs " + tabs[0].url); //this actually occurs

      chrome.tabs.sendMessage(tabs[0].id, {highlight: true}, function(response) {
        if (chrome.runtime.lastError) {
          // An error occurred :(
          console.log("ERROR: ", chrome.runtime.lastError);
        }
        else{
          console.log(response.message);
        }
      });
  });  
}

example.js：

chrome.runtime.sendMessage('Hello World');
chrome.tabs.onMessage.addListener(function(response, sender, sendResponse){
  console.log("received " + response); //never gets to this point
  sendResponse({message : "Response Received"});
});

background.js：

chrome.runtime.onMessage.addListener(function(response, sender, sendResponse){
  alert(response);
});
chrome.tabs.onMessage.addListener(function(response, sender, sendResponse){
 console.log("received " + response);
 sendResponse({message : "Response Received"});
});

我已经尝试了很多答案，但到目前为止似乎都没有。

Answer 1

Popups脚本的设计不能直接与内容脚本对话，您必须通过后台脚本发送消息才能完成此任务。

让您的弹出窗口首先将消息发送到后台页面，让后台页面向特定内容脚本发送另一条消息。让您的内容脚本从后台页面监听事件。

内容脚本可以连接到后台脚本，但popup.js无法连接到内容脚本

1 个答案: