标签网址更改后从后台回调到内容脚本

Question

我是Chrome扩展程序的新手，我遇到了问题。 单击我的扩展程序图标时运行脚本：

chrome.browserAction.onClicked.addListener(function(tab) { 
    chrome.tabs.executeScript({
        "file": "enterIonis.js"
    });
});

此脚本从打开的选项卡中获取一些信息，然后更改选项卡URL以加载新页面。然后，此脚本需要等待新页面完全加载以与其进行交互。为此，它打开一个端口并向使用chrome.tabs.onUpdated侦听器的后台页面发送消息。后台页面应该向内容脚本发送消息/回调，告诉它现在可以与选项卡进行交互。

background.js：

var _port;
var goodUrl;


chrome.runtime.onConnect.addListener(function(port) {
  console.assert(port.name == "enterIonis");
  port.onMessage.addListener(function(msg) {
        goodUrl = msg.url;
        _port = port; 
    });
});

chrome.tabs.onUpdated.addListener(function ( tabId, changeInfo, tab ){ 
  if ( changeInfo.status === "complete" ){

    chrome.tabs.query({'active': true, 'lastFocusedWindow': true}, function (tabs) {
        var currentUrl = tab.url;
        if(currentUrl == goodUrl){
            //should send a callback to content script here
            _port.postMessage({result: "ok"});
        }
    }); 

  }
});

content_script.js

//interacting with DOM elements
...

// sending a message to background.js
var port = chrome.runtime.connect({name: "enterIonis"});
port.postMessage({url:href});
port.onMessage.addListener(function(msg){
    // here is where the message from the background telling the tab is ready should arrive
    alert(msg.result);
});

问题是，当我尝试使用第一条消息中的端口时，出现以下错误：Error in response to tabs.query: Error: Attempting to use a disconnected port object

如何重新连接端口？或者还有其他方法可以实现我的目标吗？

Answer 1

tabs.executeScript()注入页面，而不是持久地进入选项卡

您必须将内容脚本单独注入新页面。使用tabs.executeScript()注入脚本不会将脚本注入到选项卡中，该选项卡会在加载新网页时保留选项卡。它将脚本注入页面，该脚本当前显示在指定的选项卡中。该页面中不再显示该页面后，内容脚本将不再存在。

你说你的脚本“更改了标签页面以加载新页面”，然后应该做其他事情，但它没有做。新页面开始加载后，您注入的内容脚本的上下文将与旧网页的上下文一起销毁。加载新页面后，您的内容脚本无法向后台脚本发送消息，因为您的内容脚本不再存在。