Code d'extension Chrome vs scripts de contenu vs scripts injectés

Question

J'essaie d'obtenir mon Extension Chrome pour exécuter la fonction init() chaque fois qu'une nouvelle page est chargée, mais j'ai de la difficulté à comprendre comment le faire. Ce que je comprends, j'ai besoin de faire ce qui suit dans background.html:

1. Utiliser chrome.tabs.onUpdated.addListener() pour vérifier si la page est changé
2. Utiliser chrome.tabs.executeScript d'exécuter un script.

C'est le code que j'ai:

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

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

Je suis également se demander si la fonction init() aura accès à mes autres fonctions situées dans d'autres fichiers JS?

Answer 1

Du code JavaScript dans les extensions de Chrome peuvent être répartis dans les groupes suivants:

• Code d'Extension - accès Complet à tous les permis chrome.* Api.
  Cela inclut la page d'arrière-plan, et toutes les pages qui ont un accès direct à celui-ci via chrome.extension.getBackgroundPage(), comme le navigateur pop-ups.

• Des scripts de contenu (via le fichier de manifeste ou de l' chrome.tabs.executeScript) - Partielle de l'accès à certains de l' chrome Api, un accès complet à la page du DOM (pas pour tout de la window objets, y compris les cadres).
  Le contenu des scripts s'exécutent dans un champ entre l'extension et la page. Le global window objet d'un Contenu script est distincte de la page/l'extension de l'espace de noms global.

• Injecté des scripts (par l'intermédiaire de cette méthode dans un Contenu de script) - accès Complet à toutes les propriétés de la page. Pas d'accès à l' chrome.* Api.
  Injecté scripts se comportent comme s'ils étaient inclus dans la page elle-même, et ne sont pas connectés à l'extension d'une quelconque façon. Voir ce post pour en savoir plus sur les différentes méthodes d'injection.

Pour envoyer un message à partir de l'injection de script pour le contenu du script, les événements doivent être utilisés. Voir cette réponse pour un exemple. Remarque: le Message transporté dans une extension d'un contexte à l'autre sont automatiquement (JSON)-sérialisés et analysée.

---

Dans votre cas, le code de la page de fond (chrome.tabs.onUpdated) est probablement appelée avant que le contenu du script script.js est évaluée. Ainsi, vous obtiendrez un ReferenceErrorcar init ne l'est pas .

Aussi, lorsque vous utilisez chrome.tabs.onUpdated, assurez-vous de tester si la page est complètement chargée, parce que l'événement se déclenche deux fois: Avant de charger, et sur finish:

//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();"});
    }
});