与内容脚本通信的后台页面

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相同.目前,当您进入全屏模式时,除非使用快捷方式并循环浏览所有打开的选项卡,否则无法真正导航到其他不同的选项卡.我的扩展程序会显示所有当前打开的标签,您可以切换到它们,以及地址栏,以便您可以转到其他网站等.

我有一切都在工作,因为我需要它,除了重定向到其他人的页面之外,它们都很好用.例如,使用Google阅读器,当您在后台打开文章时,它会通过谷歌的代理,然后重定向到实际文章.这是唯一不起作用的地方.但是,如果我可以在切换到新选项卡时调用App.resize()函数,那将解决我的问题.(我希望).

Answer 1

这取决于您是需要通知所有页面上的内容脚本还是仅通知选定的选项卡.我会给你两个解决方案.

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

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(如果您只需要通知新选择的标签)

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();
   }
});