chrome.extension.getViews()返回故障

Question

我试图用这种方式从背景脚本中访问内容脚本中的一个函数-

content.js

window.DOsomething = function(){
    console.log('Works?');
}

background.js

var popups = chrome.extension.getViews();
if (popups.length != 0) {
            var popup = popups[0];
            popup.DOsomething();
}

但这不管用！它抛出一个错误Uncaught TypeError: Object [object Window] has no method 'DOsomething'，但是当我在我的内容脚本中执行console.log(window)时-它向我展示了这样的方法(DOsomething)的存在！但是在popups[0]列表中没有这样的方法，我真的不明白这样的结果

Answer 1

这是Chrome扩展的一个已知特性，称为孤立世界。内容脚本被注入目标页面，不能从扩展的其他部分直接访问。要进行交互，您应该使用信息传递。

这里有一个有点过时的所以回答一个相关的问题，它可能有助于绘制一个完整的画面。在答案中，您应该调整代码以使用sendMessage，而不是sendRequest，后者被移除以支持第一个。

例如，在后台页面中进行以下调用(取自文档)：

chrome.tabs.getSelected(null, function(tab) {
  chrome.tabs.sendMessage(tab.id, {greeting: "hello"}, // you can send "DoSomething" for example
  function(response) {
    console.log(response.farewell);
  });
});

在内容脚本中，您应该侦听消息：

chrome.extension.onMessage.addListener(
  function(request, sender, sendResponse) {
    console.log(sender.tab ?
                "from a content script:" + sender.tab.url :
                "from the extension");
    if(request.greeting == "hello")
      sendResponse({farewell: "goodbye"});
    // else if(request.greeting == "DoSomething") DoSomething();
});

我不认为getViews方法是您想要的，因为它返回您的扩展页面(背景、弹出窗口、选项)，而不是注入内容脚本的页面。我认为您应该从内容脚本到后台页面使用sendMessage，以便后者“知道”所有脚本的宿主页，或者使用executeScript。

chrome.tabs.executeScript(tabId, {code: 'DOsomething();'})

Answer 2

background.js

var message = "What ever you want...";
var viewTabUrl = chrome.extension.getURL('main.html');
var views = chrome.extension.getViews();
for (var i = 0; view = views[i]; i++)
{
    if (view.location.href == viewTabUrl)
    {
        view.DOsomething (messages);
        break;
    }
}

content.js

function DOsomething (message)
{
// CODE
}

在上面的例子中，我认为'main.html‘是您的弹出窗口(Html)，并包含了content.js。