it-swarm-ru.tech

tabs.executeScript - передача параметров и использование библиотек?

Я пишу расширение для Chrome, которое должно модифицировать страницы в определенном домене в соответствии с заданным параметром, для получения которого требуется XSS, поэтому простое использование скрипта контента кажется невозможным. Итак, я решил добавить скрипт, используя tabs.executeScript.

Теперь мне нужно знать две вещи: во-первых, как передать параметры в сценарий при использовании executeScript? Я предполагаю, что могу использовать сообщения, но разве нет более прямого способа передачи параметра при внедрении скрипта?

Во-вторых, мой сценарий использует jQuery, поэтому мне нужно как-то включить jQuery. Это глупо, но я не уверен, как это сделать. До сих пор я встраивал jQuery в HTML-страницу, которую писал (например, background.html).

26
Gadi A

Если вы не хотите использовать обмен сообщениями, то:

chrome.tabs.executeScript(tabId, {file: "jquery.js"}, function(){
    chrome.tabs.executeScript(tabId, {code: "var scriptOptions = {param1:'value1',param2:'value2'};"}, function(){
        chrome.tabs.executeScript(tabId, {file: "script.js"}, function(){
            //all injected
        });
    });
});

(jquery.js должен быть помещен в папку расширений). Параметры сценария будут доступны внутри переменной scriptOptions в script.js.

С обменом сообщениями это так же просто:

chrome.tabs.executeScript(tabId, {file: "jquery.js"}, function(){
    chrome.tabs.executeScript(tabId, {file: "script.js"}, function(){
        chrome.tabs.sendMessage(tabId, {scriptOptions: {param1:'value1',param2:'value2'}}, function(){
            //all injected
        });
    });
});

Вам необходимо добавить обработчик запросов к script.js:

chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
    var scriptOptions = message.scriptOptions;
    console.log('param1', scriptOptions.param1);
    console.log('param2', scriptOptions.param2);
    doSomething(scriptOptions.param1, scriptOptions.param2);
});
48
serg

Используя вышеописанный прямой метод, я смог внедрить код в новую вкладку прямо из фонового скрипта на моем расширении Chrome. Однако имейте в виду, что раздел кода команды executeScript будет не просто принимать переменные, а только строку. Поэтому после экспериментов я обнаружил, что нам нужно предварительно настроить строку команд и включить нужные нам переменные. Как это:

var sendCode = 'document.getElementsByClassName("form-control n-gram")[0].value = "' + TMObj.brand + '";';

var TMUrl = "http://website.com";
chrome.tabs.create({ url: TMUrl }, function(tab){
            chrome.tabs.executeScript(null, {code: sendCode});
      });
});

Это сработало хорошо!

1
UltimatePeter

Лучший способ включить зависимости

Добавьте зависимые библиотеки (и другие файлы .js) в фоновые сценарии в вашем manifest.json

"background": {
  "scripts": [
    "jquery.js",
    "main.js"
]

Перечислите зависимости перед кодом приложения, чтобы они загружались раньше.

Справка: зарегистрировать фоновые сценарии

Примечание: это выполнит готовую загрузку сценариев вместо отложенной загрузки, как с executeScript.

0
vedant