Chrome扩展程序将消息从Background.js发送到内容脚本 [英] Chrome Extension Send Message From Background.js to Content Script

问题描述

我已阅读有关如何执行将消息从后台JavaScript文件（main.js）发送到Content Script（content.js）的文档，但我无法获取onMessage以打开警报。

Manifest.json
$ b

  {
name：Example，
version：1.0.1，
manifest_version：2，
description：示例说明，
background：{
scripts：[main.js] 
}，
page_action：{
default_icon：{
 19：图标/ 19.png，
38：图标/ 38.png
}，
default_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：[
标签，
地理位置
]，
图标：{
16：图标/ 16.png，
48：图标/ 48.png，
128：图标/ 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 received！）; 
} 
}）; 
  
 
 
解决方案
感谢@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） {}）; 
}）; 
} 
}）; 
  
 
I have read the documentation on how to do Send Message From background javascript file(main.js) to Content Script (content.js) but I cannot get the onMessage to open my alert.

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"
   }

}
Background javascript file (main.js)
chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
    chrome.tabs.sendMessage(tabs[0].id, {action: "SendIt"}, function(response) {});  
});
Content javascript file (content.js)
chrome.extension.onMessage.addListener(function(msg, sender, sendResponse) {
   if (msg.action == 'SendIt') {
      alert("Message recieved!");
   }
});

解决方案
Thanks to the insight of @Teepeemm I have included a tab load complettion before sending message to content script.

WAIT FOR TAB TO BE FULLY LOADED
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) {});  
      });
   }
});


                        
这篇关于Chrome扩展程序将消息从Background.js发送到内容脚本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！