Estoy escribiendo una extensión de Chrome que necesita modificar páginas en un dominio específico de acuerdo con algún parámetro dado, que necesita XSS para obtenerse, por lo que simplemente usar un script de contenido parece imposible. Entonces, decidí inyectar el script usando tabs.executeScript.
Ahora necesito saber dos cosas: primero, ¿cómo puedo pasar parámetros a la secuencia de comandos cuando uso executeScript? Supongo que puedo usar mensajes, pero ¿no hay una forma más directa de pasar el parámetro al inyectar el script?
En segundo lugar, mi secuencia de comandos usa jQuery, por lo que necesito incluir jQuery de alguna manera. Es una tontería, pero no estoy seguro de cómo hacerlo. Hasta ahora, incrusté jQuery en la página HTML que estaba escribiendo (por ejemplo, background.html).
Si no desea utilizar la mensajería, entonces:
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 debe colocarse en la carpeta de extensión). Las opciones de script estarán disponibles dentro de la variable scriptOptions en script.js .
Con la mensajería es igual de fácil:
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 }); }); }); Debería agregar un oyente de solicitud a 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); });Partiendo del método directo anterior, pude inyectar código en una nueva pestaña directamente desde el script de fondo en mi extensión de Chrome. Sin embargo, tenga en cuenta que la sección de código del comando executeScript no tomará simplemente variables, sino solo una cadena. Por lo tanto, después de experimentar, descubrí que necesitamos configurar la cadena de comandos de antemano e incluir las variables que queremos. Me gusta esto:
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}); }); });¡Esto funcionó bien!
Mejor manera de incluir dependencias
Agregue las bibliotecas dependientes (y otros archivos .js) a los scripts de fondo en su manifest.json de la siguiente manera:
"background": { "scripts": [ "jquery.js", "main.js" ]Enumere las dependencias antes del código de la aplicación para que se carguen antes.
Referencia: Registrar secuencias de comandos de fondo
Nota: esto realizaría una carga ansiosa de los scripts, en lugar de una carga diferida como con executeScript .