Registrierung des URL-Protokoll-Handlers für PWAs

Installierte PWAs können Links verarbeiten, die ein bestimmtes Protokoll verwenden, um eine bessere Integration zu ermöglichen.

Thomas Steiner

Hintergrund zu Schemas (auch Protokolle genannt)

Ein Uniform Resource Identifier (URI) ist eine kompakte Zeichenfolge, die eine abstrakte oder physische Ressource identifiziert. Jeder URI beginnt mit einem Schemanamen, der auf eine Spezifikation für die Zuweisung von IDs innerhalb dieses Schemas verweist. Die URI-Syntax ist also ein föderiertes und erweiterbares Benennungssystem, bei dem die Spezifikation jedes Schemas die Syntax und Semantik von IDs, die dieses Schema verwenden, weiter einschränken kann. Schemas werden auch als Protokolle bezeichnet. Hier sind einige Beispiele für Schemas.

tel:+1-816-555-1212
mailto:Jane.Doe@example.com
news:comp.infosystems.www.servers.unix
https://web.dev/

Der Begriff Uniform Resource Locator (URL) bezieht sich auf die Teilmenge der URIs, die nicht nur eine Ressource identifizieren, sondern auch eine Möglichkeit bieten, die Ressource zu finden, indem sie ihren primären Zugriffsmechanismus beschreiben (z.B. ihren Netzwerkstandort).

Hintergrund zur Methode registerProtocolHandler()

Die Navigator Methode registerProtocolHandler() lässt Websites ihre Fähigkeit registrieren, bestimmte URL-Schemas zu öffnen oder zu verarbeiten. Websites müssen die Methode also so aufrufen: navigator.registerProtocolHandler(scheme, url). Die beiden Parameter sind so definiert:

  • scheme: Ein String mit dem Protokoll, das die Website verarbeiten möchte.
  • url: Ein String mit der URL des Handlers. Diese URL muss %s als Platzhalter enthalten, der durch die maskierte URL ersetzt wird, die verarbeitet werden soll.

Das Schema muss entweder eines der auf der Zulassungsliste stehenden Schemas sein (z. B. mailto, bitcoin oder magnet) oder mit web+ beginnen, gefolgt von mindestens einem oder mehreren Kleinbuchstaben in ASCII nach dem Präfix web+, z. B. web+coffee.

Zur Verdeutlichung hier ein konkretes Beispiel für den Ablauf:

  1. Der Nutzer besucht eine Website unter https://coffeeshop.example.com/, die den folgenden Aufruf ausführt: navigator.registerProtocolHandler('web+coffee', 'coffee?type=%s').
  2. Später klickt der Nutzer auf https://randomsite.example.com/ auf einen Link wie <a href="web+coffee:latte-macchiato">All about latte macchiato</a>.
  3. Dadurch wird der Browser zur folgenden URL weitergeleitet: https://coffeeshop.example.com/coffee?type=web%2Bcoffee%3A%2F%2Flatte-macchiato. Die Suchstring-URL-decodierte Version lautet dann ?type=web+coffee://latte-macchiato.

Worum geht es bei der Protokollverarbeitung?

Der aktuelle Mechanismus Registrierung von URL-Protokoll-Handlern für PWAs bietet die Registrierung von Protokoll-Handlern als Teil einer PWA-Installation über das Manifest. Wenn ein Nutzer nach der Registrierung einer PWA als Protokoll-Handler in einem Browser oder einer plattformspezifischen App auf einen Hyperlink mit einem bestimmten Schema wie mailto, bitcoin oder web+music klickt, wird die registrierte PWA geöffnet und die URL empfangen. Sowohl die vorgeschlagene manifestbasierte Registrierung als auch die herkömmliche registerProtocolHandler()-Methode spielen in der Praxis eine sehr ähnliche Rolle, bieten aber dennoch die Möglichkeit für ergänzende Nutzererlebnisse:

  • Zu den Gemeinsamkeiten gehören die Anforderungen an die Liste der Schemas, die registriert werden dürfen, sowie der Name und das Format der Parameter usw.
  • Die Unterschiede bei der manifestbasierten Registrierung sind gering, können aber nützlich sein, um die Nutzerfreundlichkeit für PWA-Nutzer zu verbessern. Bei der manifestbasierten PWA-Registrierung ist beispielsweise möglicherweise keine zusätzliche Nutzeraktion erforderlich, abgesehen von der vom Nutzer initiierten Installation der PWA.

Anwendungsfälle

  • In einer Textverarbeitungs-PWA findet der Nutzer in einem Dokument einen Link zu einer Präsentation wie web+presentations://deck2378465. Wenn der Nutzer auf den Link klickt, wird die Präsentations-PWA automatisch im richtigen Bereich geöffnet und die Präsentation angezeigt.
  • In einer plattformspezifischen Chat-App erhält der Nutzer in einer Chatnachricht einen Link zu einer magnet-URL. Wenn er auf den Link klickt, wird eine installierte Torrent-PWA gestartet und der Download beginnt.
  • Der Nutzer hat eine PWA für Musikstreaming installiert. Wenn ein Freund einen Link zu einem Song wie web+music://songid=1234&time=0:13 teilt und der Nutzer darauf klickt, wird die PWA für Musikstreaming automatisch in einem separaten Fenster gestartet.

Registrierung von URL-Protokoll-Handlern für PWAs verwenden

Die API für die Registrierung von URL-Protokoll-Handlern ist eng an navigator.registerProtocolHandler() angelehnt. Dieses Mal werden die Informationen jedoch deklarativ über das Web-App-Manifest in einer neuen Eigenschaft namens "protocol_handlers" übergeben, die ein Array von Objekten mit den beiden erforderlichen Schlüsseln "protocol" und "url" verwendet. Das folgende Code-Snippet zeigt, wie web+tea und web+coffee registriert werden. Die Werte sind Strings mit der URL des Handlers und dem erforderlichen Platzhalter %s für die maskierte URL.

{
  "protocol_handlers": [
    {
      "protocol": "web+tea",
      "url": "/tea?type=%s"
    },
    {
      "protocol": "web+coffee",
      "url": "/coffee?type=%s"
    }
  ]
}

Mehrere Apps für dasselbe Protokoll registrieren

Wenn mehrere Anwendungen sich als Handler für dasselbe Schema registrieren, z. B. das mailto-Protokoll, wird dem Nutzer vom Betriebssystem eine Auswahl angezeigt, in der er entscheiden kann, welcher der registrierten Handler verwendet werden soll.

Dieselbe App für mehrere Protokolle registrieren

Dieselbe App kann sich für mehrere Protokolle registrieren, wie im Codebeispiel zu sehen ist.

App-Updates und Handlerregistrierung

Handlerregistrierungen werden mit der neuesten Manifestversion synchronisiert, die von der App bereitgestellt wird. Es gibt zwei Fälle:

  • Ein Update, das neue Handler hinzufügt, löst die Handlerregistrierung aus (unabhängig von der App-Installation).
  • Ein Update, das Handler entfernt, löst die Aufhebung der Handlerregistrierung aus (unabhängig von der App-Deinstallation).

Protokoll-Handler in den Entwicklertools debuggen

Gehen Sie über den Bereich Anwendung > Manifest zum Abschnitt Protokoll-Handler. Hier können Sie alle verfügbaren Protokolle ansehen und testen.

Protokoll-Handler im Manifestbereich

Sicherheitsaspekte

Da für die PWA-Installation ein sicherer Kontext erforderlich ist, gilt diese Einschränkung auch für die Protokollverarbeitung. Die Liste der registrierten Protokoll-Handler wird nicht im Web veröffentlicht und kann daher nicht als Fingerprinting-Vektor verwendet werden.

Navigationsversuche, die nicht vom Nutzer initiiert wurden

Navigationsversuche, die nicht vom Nutzer initiiert wurden, sondern programmatisch sind, öffnen möglicherweise keine Apps. Die benutzerdefinierte Protokoll-URL darf nur in Browserkontexten der obersten Ebene verwendet werden, nicht z. B. als URL eines iFrames.

Zulassungsliste von Protokollen

Wie bei registerProtocolHandler() gibt es eine Zulassungsliste von Protokollen, die Apps zur Verarbeitung registrieren können.

Beim ersten Start der PWA aufgrund eines aufgerufenen Protokolls wird dem Nutzer ein Berechtigungsdialogfeld angezeigt. In diesem Dialogfeld werden der App-Name und die App-Quelle angezeigt. Der Nutzer wird gefragt, ob die App Links aus dem Protokoll verarbeiten darf. Wenn ein Nutzer das Berechtigungsdialogfeld ablehnt, wird der registrierte Protokoll-Handler vom Betriebssystem ignoriert. Um die Registrierung des Protokoll-Handlers aufzuheben, muss der Nutzer die PWA deinstallieren, die ihn registriert hat. Der Browser hebt die Registrierung des Protokoll-Handlers auch auf, wenn der Nutzer „Meine Auswahl speichern“ auswählt und „Nicht zulassen“ auswählt.

Feedback

Das Chromium-Team möchte mehr über Ihre Erfahrungen mit der Registrierung von URL-Protokoll-Handlern für PWAs erfahren.

Informationen zum API-Design

Funktioniert etwas an der API nicht wie erwartet? Oder fehlen Methoden oder Eigenschaften, die Sie zur Umsetzung Ihrer Idee benötigen? Haben Sie eine Frage oder einen Kommentar zum Sicherheitsmodell? Melden Sie ein Spezifikationsproblem im entsprechenden GitHub-Repository oder fügen Sie Ihre Gedanken zu einem bestehenden Problem hinzu.

Problem mit der Implementierung melden

Haben Sie einen Fehler bei der Implementierung von Chromium gefunden? Oder unterscheidet sich die Implementierung von der Spezifikation? Melden Sie einen Fehler unter new.crbug.com. Geben Sie so viele Details wie möglich an, einschließlich einer Anleitung zur Reproduktion, und geben Sie UI>Browser>WebAppInstalls im Feld Komponenten ein.

Unterstützung für die API zeigen

Planen Sie, die Registrierung von URL-Protokoll-Handlern für PWAs zu verwenden? Ihre öffentliche Unterstützung hilft dem Chromium-Team, Funktionen zu priorisieren, und zeigt anderen Browseranbietern, wie wichtig es ist, sie zu unterstützen.

Teilen Sie im WICG Discourse-Thread mit, wie Sie die Funktion verwenden möchten. Senden Sie einen Tweet an @ChromiumDev mit dem Hashtag #ProtocolHandler und teilen Sie uns mit, wo und wie Sie die Funktion verwenden.

Danksagungen

Die Registrierung von URL-Protokoll-Handlern für PWAs wurde von Fabio Rocha, Diego González, Connor Moody und Samuel Tang vom Microsoft Edge -Team implementiert und spezifiziert. Dieses Dokument wurde von Joe Medley und Fabio Rocha überprüft.