google-chrome - 与 Content Script 通信的后台页面

Question

我在使用最后一点代码来完成我的扩展时遇到了一些麻烦。

简短的版本是我需要我的 background.html 页面在选择不同的选项卡时通知我的内容脚本。目前我有以下内容:

background.html

chrome.tabs.onSelectionChanged.addListener(function( tab_id , info ) {
    // some way to call App.resize();
});

内容脚本js文件

var App = {
    resize: function() {
        // logic
    }
}

较长的版本是我正在为 chrome 构建一个全屏扩展，它与 PC 上的 Firefox 和 Safari 一样工作。目前，当您进入全屏模式时，您无法真正导航到不同的其他选项卡，除非您使用快捷方式并循环浏览所有打开的选项卡。我的扩展程序显示了所有当前打开的选项卡，您可以切换到它们，还有一个地址栏，以便您可以转到其他网站等。

我的一切都在我需要的时候运行，而且除了重定向到其他页面的页面外，一切都运行良好。例如。使用谷歌阅读器，当你在后台打开一篇文章时，它会通过谷歌的代理，然后重定向到实际的文章。这是它唯一不起作用的地方。但是，如果我可以在每次切换到新选项卡时调用 App.resize() 函数，那将解决我的问题。 (我希望)。

Answer 1

这取决于您是需要通知所有页面上的内容脚本还是只通知选定的选项卡。我将为您提供两者的解决方案。

background.html(如果需要通知所有tab)

chrome.tabs.onSelectionChanged.addListener(function() {
   chrome.windows.getAll({populate: true}, function(windows) {
      var w,t;
      for (w=0; w<windows.length; w++) {
         for (t=0; t<windows[w].tabs.length; t++) {
            chrome.tabs.sendRequest(windows[w].tabs[t].id, "resize");
         }
      }
   });
});

background.html(如果只需要通知新选择的tab)

chrome.tabs.onSelectionChanged.addListener(function(tabId) {
   chrome.tabs.sendRequest(tabId, "resize");
});

内容脚本

var App = {
   resize: function() {
      // logic
   }
};

chrome.extension.onRequest.addListener(function(request) {
   if (request === "resize") {
      App.resize();
   }
});