online - javascript console chrome

Varios archivos JS en Chrome Extension-¿Cómo cargarlos?

Question

He escrito una extensión de Chrome. Mi archivo background.js es bastante grande, así que quiero dividirlo en partes más pequeñas y cargar métodos específicos cuando sea necesario (algún tipo de carga lenta)

He hecho esto con Firefox:

// ( call for load specified lib )
var libPath = redExt.basePath + ''content/redExt/lib/'' + redExt.browser + ''/'' + libName + ''.js'';
var service = Components.classes["@mozilla.org/moz/jssubscript-loader;1"].getService(Components.interfaces.mozIJSSubScriptLoader);
service.loadSubScript("chrome://" + libPath);
// ( executing loaded file )

¿Existe alguna posibilidad de hacerlo de manera similar en los navegadores basados ​​en Webkit? He encontrado soluciones sobre cómo inyectar múltiples archivos JS en páginas coincidentes (usando manifest.json ) pero no encuentro la forma de incluir el archivo JS solo por extensión.

Answer 1

Podrías intentar usar trabajadores web, tal vez. En tu background.js, incluye:

var worker = new Worker(''new-script.js'');

Los trabajadores web pueden generar nuevos trabajadores e incluso tener un método importScript ("new-script.js").

Sin embargo, los trabajadores de la web tienden a ser muy limitados. Compruebe here para un gran artículo sobre los trabajadores de la web.

Sin embargo, no sé si funcionarían. La otra opción es usar XMLHTTPRequest (AJAX) para recuperar dinámicamente la secuencia de comandos y evaluarla. Sin embargo, en una conexión que no es HTTPS, esto probablemente esté bloqueado debido a ataques de intermediario. Alternativamente, puede forzar a Chrome a que evalúe el script desde una conexión no cifrada (PERO NO LO HAGA) agregando esto a manifest.json :

"content_security_policy": "script-src ''self'' ''unsafe-eval''; object-src ''self''",
"permissions": ["http://badpractic.es/insecure.js"]

Consulte Cargar la página web remota en la página de fondo: Chrome Extension para una discusión más detallada del método AJAX.

Así que tus opciones parecen ser limitadas.

Esto, por supuesto, los carga todos a la vez:

{
"name": "My extension",
...
"background": {
"scripts": ["background.js","background2.js","background3.js"] //and so on
},
...
}

Answer 2

Posible solución encontrada. Hay una implementación simple del método principal RequireJS que requiere que el rastreo de devolución de llamada de JavaScript encuentre el evento para cargar el archivo de extensión principal y que los enlaces lo ejecuten con el contexto de extensión. https://github.com/salsita/browser-require/blob/master/require.js

Parece funcionar, pero esta solución tiene algunas desventajas:

• los informes de errores se informan en "línea 1, columna 1" porque esta solución inyecta el código directamente a func.call - la depuración es muy difícil
• Los archivos JS cargados no aparecen en la consola / chromebug
• Si la pestaña actual utiliza HTTPS, Chrome no permitirá evaluar los scripts, especialmente en el contexto local ( file:/// ), por lo que a veces simplemente no funciona como se espera

Answer 3

Si desea cargar un archivo javascript en el contexto de su página de fondo y desea evitar el uso de eval , puede simplemente agregar una etiqueta de script al DOM de su página de fondo. Por ejemplo, esto funciona si sus archivos están presentes en la carpeta lib de su extensión:

function loadScript(scriptName, callback) {
var scriptEl = document.createElement(''script'');
scriptEl.src = chrome.extension.getURL(''lib/'' + scriptName + ''.js'');
scriptEl.addEventListener(''load'', callback, false);
document.head.appendChild(scriptEl);
}

Answer 4

También puede hacerlo de la manera extremadamente sencilla que se describe aquí: https://developer.chrome.com/extensions/background_pages#manifest

{
"name": "My extension",
...
"background": {
"scripts": [
"lib/fileone.js",
"lib/filetwo.js",
"background.js"
]
},
...
}

No hará una carga lenta, pero le permite dividir su código en varios archivos y especificar el orden en que se cargan en la página de fondo.