Chrome 扩展程序将消息从后台.js发送到内容脚本

Question

我已经阅读了有关如何将消息从后台javascript文件（main.js）发送到内容脚本（content.js）的文档，但是我无法获得onMessage来打开我的警报。

Manifest.json

{
   "name": "Example",
   "version": "1.0.1",
   "manifest_version" : 2,
   "description": "Example Description",
   "background" : {
     "scripts" : ["main.js"]
   },
   "page_action" : {
      "default_icon": {
         "19": "icons/19.png",
         "38": "icons/38.png"
      },
      "default_title" : "Example Title"
   },
   "content_scripts": [{
      "matches": ["<all_urls>"],
      "js": ["lib/jquery-1.8.3.min.js","scripts/content.js"],
      "run_at": "document_idle",
      "all_frames": false
   }],
   "permissions": [
       "tabs",
       "geolocation"
   ],
   "icons": {
       "16": "icons/16.png",
       "48": "icons/48.png",
       "128": "icons/48.png"
   }
}

后台 JavaScript 文件 （main.js）

chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
    chrome.tabs.sendMessage(tabs[0].id, {action: "SendIt"}, function(response) {});  
});

内容 JavaScript 文件 （content.js）

chrome.extension.onMessage.addListener(function(msg, sender, sendResponse) {
   if (msg.action == 'SendIt') {
      alert("Message recieved!");
   }
});

Answer 1

感谢@Teepeemm的洞察力，我在将消息发送到内容脚本之前包含一个选项卡加载完成。

等待选项卡完全加载

chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {          
   if (changeInfo.status == 'complete') {   
      chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
         chrome.tabs.sendMessage(tabs[0].id, {action: "SendIt"}, function(response) {});  
      });
   }
});

Answer 2

旁注：chrome.extension.onMessage被弃用，你应该使用chrome.runtime.onMessage - 尽管我不相信这会解决你的问题。

我记得我在使用内容脚本注入缩小的 jquery 文件时遇到问题。尝试使用未缩小的版本（即jquery-1.8.3.js）。完成此操作后，还要将jquery-1.8.3.js添加到清单文件中的web_accessible_resources。（在这里阅读）

如果它仍然不起作用，我的最后一个建议是将"<all_urls>"添加到清单中的权限数组中。

Answer 3

如果你让每个脚本宣布它的存在（我更喜欢console.log而不是alert），你会看到后台脚本运行一次（在安装或启动时），而内容脚本在每个新页面一起运行。 这意味着您需要让一些外部事件触发消息。 类似的东西

chrome.pageAction.onClicked.addListener(function(tab) {
    chrome.tabs.sendMessage(tab.id,{action:"SendIt"});
});

并且不要忘记酌情致电chrome.pageAction.show(tabId);。