Eine Extension (Erweiterung) beinhaltet eine Sammlung von Dateien, gepackt für die Verbreitung and Installation. In diesem Artikel, gehen wir kurz auf Dateien ein, die vorhanden sein könnten.
"manifest.json" ist die einzige Datei, die in jeder Extension vorhanden sein muss. Sie enthält die grundlegenden Metadaten wie Name, Version und benötigte Genehmigungen. Außerdem verweist sie auf andere Dateien der Extension.
Dieses Manifest kann auch Zeiger zu mehreren anderen Dateitypen haben:
Für weitere Einzelheiten gehe auf manifest.json.
Neben den vom Manifest referenzierten Seiten, kann eine Extension zusätzlche Extension pages mit unterstützenden Dateien enthalten.
Extensions müssen oft langzeitig ihren Zustand aufrechterhalten oder Operationen, unabhängig der Lebensdauer von irgendwelchen speziellen Webseiten oder Browserfenstern, durchführen. Dafür gibt es Hintergrundskripte (background scripts).
Hintergrundskripte werden geladen, sobald die Extension geladen ist und laufen bis die Extension deaktiviert oder deinstalliert wird. Du kannst alles aus den WebExtension APIs im Skript benutzen, solange du die notwendigen Berechtigungen abgefragt hast.
Du kannst ein Hintergrundskript einbinden in dem du den background-Key in "manifest.json" benutzt:
// manifest.json
"background": {
"scripts": ["background-script.js"]
}
Du kannst mehrere background scripts angeben: wenn du sie im selben Kontext laufen lässt, so wie mehrere Skripts, die in eine einzelne Seite geladen werden.
Hintergrundskripte laufen im Rahmen spezieller Seiten genannt 'background pages' (Hintergrundseiten). Diese geben ihnen ein globales window, samt der vollständigen Standard DOM APIs, die von diesem Objekt bereitgestellt werden.
Du musst deine Hintergrundseite nicht bereitstellen. Wenn du dein Hintergrundskript hinzufügst, wird eine leere Hintergrundseite für dich erstellt.
Dennoch kannst du deine Hintergrundseite auch als separate HTML-Datei erstellen:
// manifest.json
"background": {
"page": "background-page.html"
}
Hintergrundskripte können alles aus den WebExtension APIs im Skript nutzen, solange deren Extension die notwendigen Berechtigungen hat.
Hintergrundskripte können XHR-Anfragen an alle Hosts machen, für die sie host permissions haben.
Hintergrundskripte haben keinen direkten Zugriff auf Webseiten. Sie können jedoch Content-Scripts in Webseiten laden und mit ihnen über message-passing API kommunizieren.
Hintergrundskripte sind beschränkt in einigen potenziell gefährlichen Operationen, wie dem Benutzen von eval(), durch ein Sicherheitskonzept. Für mehr Informationen siehe Content Security Policy.
Deine Extension kann unterschiedliche Benutzeroberflächenkomponenten enthalten, deren Inhalt wird durch ein HTML-Dokument festgelegt:
Für jeden dieser Komponenten, erstellst du eine HTML-Datei und verweist auf sie über ein spezielles Attribut in manifest.json. Die HTML-Datei kann, wie eine normale Webseite, CSS- und JavaScript-Dateien einbinden.
Sie alle sind Arten von Extension pages, und nicht wie eine normale Webseite, dein JavaScript kann dieselben WebExtension APIs wie dein Hintergrundskript benutzen. Sie können sogar direkt Variabeln aus der Hintergrundseite, mit {{WebExtAPIRef("runtime.getBackgroundPage()")}}, abrufen.
Du kannst außerdem HTML-Dokumente in deine Extension mit einbeziehen, die nicht vordefinierten Benutzeroberflächenkomponenten beigefügt wurden. Anders als die Dokumente, die du für Sidebars, Pop-ups, oder Option-Pages bereitstellen könntest, haben diese keinen Zugang zu "manifest.json". Dennoch haben sie Zugriff auf dieselben WebExtension APIs wie dein Hintergrundskript.
Du lädst eine solche Seite normalerweise mit {{WebExtAPIRef("windows.create()")}} oder {{WebExtAPIRef("tabs.create()")}}.
Siehe Extension pages um mehr zu lernen.
Benutze Content-Scripts um Webseiten abzurufen und zu manipulieren. Content-Scripts werden in Webseiten geladen und laufen im Rahmen der jeweiligen Seite.
Content-Scripts sind von der Erweiterung bereitgestellte Skripts, die im Kontext einer Webseite laufen; das unterscheidet sie von Skripts, die von der Seite selber geladen werden, einschließlich derer, die in {{HTMLElement("script")}}-Elementen innerhalb der Seite bereitgestellt werden.
Content-Scripts können das Seiten-DOM sehen und manipulieren, so wie normale, von der Seite geladene Skripte.
Im Gegensatz zu normalen Skripten können sie:
Content-Scripts können nicht direkt normale Skripte der Seite abrufen, aber mit ihnen Nachrichten austauschen über die übliche window.postMessage() API.
Wenn wir gewöhnlich über Content-Scripts sprechen, dann im Bezug auf JavaScript. Du kannst jedoch auch CSS zu einer Webseite über das selbe System hinzufügen.
Sieh dir content scripts an um mehr zu erfahren.
Zugängliche Webressourcen(Web accessible resources) sind Ressourcen wie Bilder, HTML, CSS, und JavaScript, die du in die Extension einbindest und für Content-Scripts und Skripten der Seite zugänglich machen möchtest. Ressourcen, die web-zugänglich gemacht werden, können von Skripten der Seite und Content-Scripts über ein spezielles URI-Schema referenziert werden.
Wenn zum Beispiel ein Content-Script Bilder in eine Webseite einfügen will, kannst du sie in der Extension beifügen und web-zugänglich machen. Dann könnte das Content-Script img-Tags erzeugen und hinzufügen, die über das src-Attribut auf die Bilder verweisen.
Um mehr zu lernen, sieh die Dokumentation für den web_accessible_resources manifest.json key.