it-swarm.com.de

Chrome Erweiterungscode vs Content-Skripte vs Injected-Skripte

Ich versuche, mit meiner Chrome Erweiterung die Funktion init() auszuführen, wenn eine neue Seite geladen wird, aber ich habe Probleme zu verstehen, wie das geht Ich verstehe, ich muss Folgendes in background.html tun:

  1. Verwenden Sie chrome.tabs.onUpdated.addListener(), um zu überprüfen, wann die Seite geändert wird
  2. Verwenden chrome.tabs.executeScript, um ein Skript auszuführen.

Dies ist der Code, den ich habe:

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

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

Ich frage mich auch, ob die init () - Funktion Zugriff auf meine anderen Funktionen in anderen JS-Dateien haben wird?

55
Jon

JavaScript-Code in Chrome Erweiterungen können in die folgenden Gruppen unterteilt werden:

  • Erweiterungscode - Voller Zugriff auf alle erlaubten chrome.* APIs.
    Dies umfasst die Hintergrundseite und alle Seiten, die über chrome.extension.getBackgroundPage() direkten Zugriff darauf haben, wie z. B. die Browser-Popups .

  • Inhaltsskripte (über die Manifestdatei oder chrome.tabs.executeScript ) - teilweise Zugriff auf einige der chrome-APIs , uneingeschränkter Zugriff auf das DOM der Seite (, nicht auf eines der window Objekte, einschließlich Frames).
    Inhaltsskripte werden in einem Bereich zwischen der Erweiterung und der Seite ausgeführt. Das globale window -Objekt eines Content-Skripts unterscheidet sich vom globalen Namespace der Seite/Erweiterung.

  • Eingespritzte Skripte (über diese Methode in einem Inhaltsskript) - Voller Zugriff auf alle Eigenschaften der Seite. Kein Zugriff auf eine der chrome.* - APIs.
    Eingefügte Skripte verhalten sich so, als wären sie von der Seite selbst aufgenommen worden und sind in keiner Weise mit der Erweiterung verbunden. Siehe dieser Beitrag , um weitere Informationen zu den verschiedenen Injektionsmethoden zu erhalten.

Um eine Nachricht vom injizierten Skript an das Inhaltsskript zu senden, müssen Ereignisse verwendet werden. Siehe diese Antwort für ein Beispiel. Hinweis: Nachrichten, die innerhalb einer Erweiterung von einem Kontext zu einem anderen transportiert werden, werden automatisch (JSON) -serialisiert und analysiert .


In Ihrem Fall wird der Code auf der Hintergrundseite ( chrome.tabs.onUpdated ) wahrscheinlich aufgerufen, bevor das Inhaltsskript script.js Ausgewertet wird. Sie erhalten also ein ReferenceError, weil init nicht ist.

Wenn Sie chrome.tabs.onUpdated Verwenden, stellen Sie außerdem sicher, dass Sie testen, ob die Seite vollständig geladen ist, da das Ereignis zweimal ausgelöst wird: Vor dem Laden und beim Beenden:

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