Расширение Chrome: проблема с SendMessage

Question

Я пытаюсь изменить содержимое страницы на основе вывода вызова xhr. Я отправляю сообщение из content.js, создавая вызов xrh в фоновом js-файле, а затем передавая результат в content.js, который изменяет содержимое страницы.

Из моего content.js файла Я делаю следующее.

var s = document.createElement('script'); 
s.src = chrome.extension.getURL('src/content/main.js'); 
(document.head || document.documentElement).appendChild(s); 

В моей main.js я делаю

chrome.runtime.sendMessage({ 
    method: 'GET', 
    action: 'xhttp', 
    url: myurl 
    }, function(responseText) { 
     console.log("Response Text is ", responseText); 
    }); 

И в моей bg.js У меня есть следующие

chrome.runtime.onMessage.addListener(function(request, sender, callback) { 
    if (request.action == "xhttp") { 
     var xhttp = new XMLHttpRequest(); 
     var method = request.method ? request.method.toUpperCase() : 'GET'; 
     xhttp.onload = function() { 
      callback(xhttp.responseText); 
     }; 
     xhttp.onerror = function() { 
      // Do whatever you want on error. Don't forget to invoke the 
      // callback to clean up the communication port. 
      callback('Error'); 
     }; 
     xhttp.open(method, request.url, true); 
     if (method == 'POST') { 
      xhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
     } 
     xhttp.send(request.data); 
     return true; // prevents the callback from being called too early on return 
    } 
}); 

Проблема я столкнулся, я получаю ошибку Invalid arguments to connect. для chrome.runtime.sendMessage функции ,

Я не уверен, что мне не хватает. Любая помощь нам очень ценится.

Answer 1

Вы пытались внедрить свой скрипт контента на страницу с тегом <script>.

Когда вы это сделаете, ваш скрипт перестает быть сценарием контента: он выполняется в контексте страницы и теряет все повышенный доступ к API Chrome, включая sendMessage.

Вы должны прочитать на isolated world concept и this question о скриптах на уровне страницы.

Чтобы использовать jQuery, вы не должны полагаться на копию, предоставленную страницей, - это в другом контексте и поэтому непригодна для использования. Вы должны включать в себя локальную копию JQuery с файлами и загружать его до вашего сценария:

1. Если вы используете манифест впрыснуть сценарии, вы можете добавить JQuery в список , прежде чем вашего скрипта:

   "content_scripts": [ 
       { 
       matches: ["http://*.example.com/*"], 
       js: ["jquery.js", "content.js"] 
       } 
   ], 
   

2. Если вы используете программную инъекцию, цепь загружать скрипты, чтобы обеспечить порядок загрузки:

   chrome.tabs.executeScript(tabId, {file: "jquery.js"}, function() { 
       chrome.tabs.executeScript(tabId, {file: "content.js"}); 
   });