Erweiterungen – Konzepte und Architektur

In diesem Artikel werden Konzepte zum Erstellen einer Microsoft Edge-Erweiterung vorgestellt. Folgen Sie den Anweisungen, um zu verstehen, wie Browser mit mehreren Registerkarten funktionieren.

Eine Microsoft Edge-Erweiterung ist eine kleine App, für die Benutzer sich entscheiden können, die Features von Microsoft Edge hinzufügt oder ändert, um eine spezielle Erfahrung oder Funktion bereitzustellen, die für eine Zielgruppe wichtig ist. Eine Einführung finden Sie unter Übersicht über Microsoft Edge-Erweiterungen.

Grundlegendes zur Funktionsweise von Browsern

Nachfolgend sind hilfreiche Informationen aufgeführt, die Sie vor dem Erstellen Ihrer Erweiterung benötigen.

Browserregisterkarten sind isolierte Threads

Jede Browserregisterkarte ist von jeder anderen Registerkarte isoliert. Jede Registerkarte wird in einem separaten Thread ausgeführt, der von anderen Browserregisterkarten und Threads isoliert ist.

Jede Registerkarte verarbeitet eine GET-Anforderung.

Jeder Tab verarbeitet eine GET-Anforderung. Jeder Tab verwendet eine URL, um einen einzelnen Datenstrom zu erhalten, bei dem es sich normalerweise um ein HTML-Dokument handelt. Dieser einzelne Datenstrom oder diese Seite enthält Anweisungen wie JavaScript einschließlich Tags, Bildverweise, CSS-Verweise und vieles mehr. Alle Ressourcen werden auf diese Tabseite heruntergeladen, und anschließend wird die Seite in dem Tab gerendert.

Kommunikation zwischen jeder Registerkarte und einem Remoteserver

Jeder Tab kommuniziert mit einem Remoteserver. Jeder Tab wird in einer isolierten Umgebung ausgeführt. Jeder Tab bleibt mit dem Internet verbunden, ist jedoch von anderen Tabs isoliert. Eine Registerkarte kann JavaScript ausführen, um mit einem Server zu kommunizieren. Der Server ist der Ursprungsserver für die erste GET-Anforderung, die in die URL-Leiste des Tabs eingegeben wurde.

Kommunikationsmodell

Im Erweiterungsmodell wird ein anderes Kommunikationsmodell verwendet. Ähnlich wie bei einer Tabseite wird eine Erweiterung in einem einzelnen Thread ausgeführt, der von anderen Tabseitenthreads isoliert ist. Ein Tab sendet einzelne GET-Anforderungen an Remoteserver und rendert dann die Seite. Eine Erweiterung funktioniert jedoch ähnlich wie ein Remoteserver. Durch das Installieren einer Erweiterung in einem Browser wird ein eigenständiger Webserver im Browser erstellt. Die Erweiterung ist von allen Tabseiten isoliert.

Die Architektur von Erweiterungen

Nachfolgend sind hilfreiche Informationen zur Architektur einer Erweiterung aufgeführt.

Erweiterungswebserverbundle

Eine Erweiterung ist ein Bündel von Webressourcen. Die Webressourcen ähneln anderen Ressourcen, die Sie (der Webentwickler) auf Webservern veröffentlichen. Beim Erstellen einer Erweiterung bündeln Sie die Webressourcen in einer ZIP-Datei.

Die ZIP-Datei enthält HTML-, CSS-, JavaScript- und Bilddateien. Im Stammverzeichnis der ZIP-Datei ist eine weitere Datei erforderlich. Bei dieser weiteren Datei handelt es sich um die Manifestdatei mit dem Namen manifest.json. Die Manifestdatei ist die Blaupause Ihrer Erweiterung und umfasst die Version Ihrer Erweiterung, den Titel, die Berechtigungen, die für ihre Ausführung erforderlich sind, und so weiter.

Starten des Erweiterungsservers

Webserver enthalten Ihr Webbündel. Ein Browser navigiert zu URLs auf dem Server und lädt die im Browser zu rendernde Datei herunter. Ein Browser navigiert mithilfe von Zertifikaten, Konfigurationsdateien und so weiter. Wenn eine index.html-Datei angegeben ist, wird die Datei an einem bestimmten Ort auf dem Webserver gespeichert.

Wenn Sie eine Erweiterung verwenden, gelangt die Tabseite Ihres Browsers mithilfe der Erweiterungslaufzeit zum Webbundle Ihrer Erweiterung. Die Erweiterungslaufzeit stellt die Dateien aus der URL extension://{some-long-unique-identifier}/index.htmlbereit, wobei {some-long-unique-identifier} ein eindeutiger Bezeichner ist, der der Erweiterung während der Installation zugewiesen ist. Jede Erweiterung verwendet einen anderen eindeutigen Bezeichner. Jeder Bezeichner verweist auf das Webbundle, das in Ihrem Browser installiert ist.

Kommunikation mit Registerkarten und Browsersymbolleiste

Eine Erweiterung kann mit Registerkarten und der Browsersymbolleiste kommunizieren. Eine Erweiterung kann mit der Symbolleiste Ihres Browsers interagieren. Jede Erweiterung verwaltet die Ausführung von Tabseiten in separaten Threads, und die DOM-Manipulation auf jeder Tabseite ist isoliert. Eine Erweiterung verwendet die Erweiterungs-API für die Kommunikation zwischen der Erweiterung und den Tabseiten. Die Erweiterungs-API bietet zusätzliche Funktionen wie Benachrichtigungsverwaltung, Speicherverwaltung und so weiter.

Genau wie Webserver wartet eine Erweiterung auf Benachrichtigungen, wenn der Browser geöffnet ist. Erweiterungen und Tabseiten werden in Threads ausgeführt, die voneinander isoliert sind. Damit eine Erweiterung mit einer beliebigen Tabseite funktioniert, verwenden Sie die Erweiterungs-API, und legen Sie die Berechtigungen in der Manifestdatei fest.

Anmeldeberechtigungen zum Zeitpunkt der Installation

Eine Erweiterung bietet bei der Installation Opt-In-Berechtigungen. Sie geben die Erweiterungsberechtigungen in der Datei manifest.json an. Wenn ein Benutzer eine Erweiterung installiert, werden Informationen zu den Berechtigungen angezeigt, die für die Erweiterung erforderlich sind. Basierend auf dem erforderlichen Berechtigungstyp kann die Erweiterung Informationen aus dem Browser extrahieren und verwenden.

Nächste Schritte

Installieren, ausführen und untersuchen Sie als Nächstes beispiel: Bildanzeige-Popupwebseite.