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

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

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

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

Ответ 1

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

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 следует поместить в папку расширения). Параметры Script будут доступны внутри переменной 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);
});

Ответ 2

Исходя из прямого метода выше, я смог ввести код в новую вкладку непосредственно из фона script в моем расширении 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});
      });
});

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

Ответ 3

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

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

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

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

Справка: Регистрация фоновых скриптов

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