Código de extensión de Chrome vs Guiones de contenido vs Guiones inyectados

Question

Estoy intentando que mi extensión de Chrome ejecute la función init() cada vez que se carga una página nueva, pero tengo problemas para tratar de entender cómo hacerlo. Por lo que entiendo, tengo que hacer lo siguiente en background.html:

1. Uso chrome.tabs.onUpdated.addListener() para comprobar si la página es cambió
2. Uso chrome.tabs.executeScript para ejecutar un script.

Este es el código que tengo:

//background.html 
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) { 
    chrome.tabs.executeScript(null, {code:"init();"}); 
}); 

//script.js 
function init() { 
    alert("It works!"); 
} 

También me pregunto si la función init() tendrá acceso a mis otras funciones ubicadas en otros archivos JS?

Answer 1

código JavaScript en las extensiones de Chrome se puede dividir en los siguientes grupos:

• código de extensión - Acceso completo a todas las API permite chrome.*.
  Esto incluye background page, y todas las páginas que tienen acceso directo a través de chrome.extension.getBackgroundPage(), como browser pop-ups.

• Content scripts (a través del archivo de manifiesto o chrome.tabs.executeScript) - Partial acceso a algunas de las APIs chrome, acceso completo a DOM de la página (no a cualquiera de los window objetos, incluyendo marcos).
  Las secuencias de comandos de contenido se ejecutan en un ámbito entre la extensión y la página. El objeto global window de una secuencia de comandos de contenido es distinto del espacio de nombres global de la página/extensión.

• Scripts inyectados (a través de this method en una secuencia de comandos de contenido) - Acceso completo a todas las propiedades de la página. Sin acceso a ninguna de las API chrome.*.
  Los scripts inyectados se comportan como si la página los incluyera y no están conectados a la extensión de ninguna manera. Consulte this post para obtener más información sobre los diversos métodos de inyección.

Para enviar un mensaje desde el script inyectado al script de contenido, los eventos deben ser utilizados. Ver this answer para un ejemplo. Nota: El mensaje transportado dentro de una extensión de un contexto a otro es automáticamente (JSON) -serializado y analizado.

---

En su caso, el código de la página de fondo (chrome.tabs.onUpdated) es probable llama antes de evaluar el guión contenido script.js. Por lo tanto, obtendrá un ReferenceError, porque init no lo es.

Además, cuando se utiliza chrome.tabs.onUpdated, asegúrese de que prueba si la página se ha cargado completamente, porque se activa el evento dos veces: Antes de la carga, y en el acabado:

//background.html 
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) { 
    if (changeInfo.status == 'complete') { 
     // Execute some script when the page is fully (DOM) ready 
     chrome.tabs.executeScript(null, {code:"init();"}); 
    } 
});