Rejestracja modułu obsługi protokołu URL na potrzeby PWA

Pozwól zainstalowanym aplikacjom PWA obsługiwać linki, które korzystają z określonego protokołu, aby zapewnić bardziej zintegrowaną obsługę.

Informacje o schematach (inaczej protokołach)

Identyfikator URI (Uniform Resource Identifier) to zwarta sekwencja znaków, która identyfikuje zasobu abstrakcyjnego lub fizycznego. Każdy identyfikator URI zaczyna się od schematu odnosi się do specyfikacji przypisywanie identyfikatorów w ramach tego schematu. Dzięki temu składnia identyfikatora URI jest sfederowana i rozszerzona w którym specyfikacja każdego schematu może jeszcze bardziej ograniczyć składnię i semantykę za pomocą tego schematu. Schematy są też nazywane protokołami. Oto kilka przykładów poniżej.

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

Termin Uniform Resource Locator (URL) odnosi się do podzbioru identyfikatorów URI, które oprócz identyfikacja zasobu, udostępnienie sposobu lokalizowania zasobu przez opisanie jego podstawowego dostępu mechanizm (np. lokalizacja sieciowa).

Tło dotyczące metody registerProtocolHandler()

Metoda Navigator wykorzystująca tylko bezpieczną treść registerProtocolHandler(). umożliwia witrynom rejestrowanie swojej możliwości otwierania lub obsługi określonych schematów adresów URL. Dlatego witryny muszą należy wywołać metodę w następujący sposób: navigator.registerProtocolHandler(scheme, url). Te 2 parametry to: zdefiniowane w następujący sposób:

  • scheme: ciąg znaków zawierający protokół, który ma być obsługiwany przez witrynę.
  • url: ciąg tekstowy zawierający adres URL modułu obsługi. Ten URL musi zawierać zmienną %s który zostanie zastąpiony adresem URL ze zmianą znaczenia.

Schemat musi być jednym z schematy na liście bezpiecznych witryn (na przykład mailto, bitcoin lub magnet) lub zaczynają się od web+, po którym następuje co najmniej jeden lub więcej małych liter ASCII po prefiksie web+, na przykład web+coffee.

Aby to podkreślić, oto konkretny przykład procesu:

  1. Użytkownik odwiedza witrynę pod adresem https://coffeeshop.example.com/, która wykonuje to wywołanie: navigator.registerProtocolHandler('web+coffee', 'coffee?type=%s')
  2. Później, odwiedzając witrynę https://randomsite.example.com/, użytkownik klika link na przykład <a href="web+coffee:latte-macchiato">All about latte macchiato</a>.
  3. Spowoduje to otwarcie takiego adresu URL w przeglądarce: https://coffeeshop.example.com/coffee?type=web%2Bcoffee%3A%2F%2Flatte-macchiato Wyszukiwanie dekodowany z adresem URL, a następnie odczytuje ciąg ?type=web+coffee://latte-macchiato.

O czym jest obsługa protokołów

Obecny mechanizm rejestracji modułów obsługi protokołów URL na potrzeby aplikacji PWA polega na oferowaniu modułu obsługi protokołu. jako część instalacji PWA przy użyciu pliku manifestu. Po zarejestrowaniu PWA jako modułu obsługi protokołu, gdy użytkownik kliknie hiperlink o określonym schemacie, takim jak mailto , bitcoin lub web+music w przeglądarce albo aplikacji na danej platformie, zostanie otwarta zarejestrowana aplikacja PWA i otrzymają URL. Należy zauważyć, że proponowana rejestracja oparta na pliku manifestu tradycyjne registerProtocolHandler() odgrywają w praktyce bardzo podobne role, choć nadal co daje użytkownikom możliwość uzupełniania się o elementy:

  • Podobieństwa to m.in. wymagania dotyczące listy systemów, które można zarejestrować, oraz nazwy i formatu parametrów itp.
  • Różnice w rejestracji opartej na pliku manifestu są subtelne, ale mogą być przydatne dla użytkowników aplikacji PWA. Na przykład rejestracja PWA oparta na pliku manifestu może nie wymagać tagu oprócz instalacji PWA inicjowanej przez użytkownika.

Przypadki użycia

  • W aplikacji PWA edytora tekstu użytkownik trafia w dokumencie do linku do prezentacji, takiego jak web+presentations://deck2378465 Gdy użytkownik kliknie link, pojawi się aplikacja PWA prezentacji. automatycznie otwiera się we właściwym zakresie i wyświetla prezentację.
  • W aplikacji do obsługi czatu na danej platformie użytkownik w wiadomości na czacie otrzymuje link do adresu URL magnet. Po kliknięciu linku uruchomi się zainstalowana aplikacja PWA z torrentami i rozpocznie się pobieranie.
  • Użytkownik ma zainstalowaną progresywną aplikację internetową streamingu muzyki. Gdy znajomy udostępni link do utworu, np. web+music://songid=1234&time=0:13 i użytkownik ją kliknie, aplikacja PWA do strumieniowego przesyłania muzyki są automatycznie uruchamiane w osobnym oknie.

Jak zarejestrować moduł obsługi protokołu URL na potrzeby PWA

Interfejs API rejestracji modułu obsługi protokołu URL jest ściśle modelowany navigator.registerProtocolHandler() Tym razem informacje są przekazywane deklaratywnie przez: manifestu aplikacji internetowej w nowej usłudze o nazwie "protocol_handlers", która zawiera tablicę obiekty z dwoma wymaganymi kluczami "protocol" i "url". Fragment kodu poniżej pokazuje, zarejestruj: web+tea i web+coffee. Wartościami są ciągi tekstowe zawierające adres URL modułu obsługi wymaganą zmienną %s dla adresu URL ze zmianą znaczenia.

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

Rejestrowanie wielu aplikacji przy użyciu tego samego protokołu

Jeśli wiele aplikacji rejestruje się jako moduły obsługi tego samego schematu, na przykład mailto, system operacyjny wyświetli użytkownikowi selektor i pozwoli mu wybrać zarejestrowanych modułów obsługi.

Ta sama aplikacja z wieloma protokołami

Ta sama aplikacja może zarejestrować się w przypadku wielu protokołów, co widać w przykładowym kodzie powyżej.

Aktualizacje aplikacji i rejestracja modułów obsługi

Rejestracje modułów obsługi są synchronizowane z najnowszą wersją pliku manifestu udostępnionej przez aplikację. OK występują 2 przypadki:

  • Aktualizacja, która dodaje nowe moduły obsługi uruchamia rejestrację modułów obsługi (niezależnie od instalacji aplikacji).
  • Aktualizacja, która usuwa moduły obsługi, uruchamia proces wyrejestrowania modułu obsługi (niezależnie od aplikacji) odinstalowywanie).

Debugowanie modułu obsługi protokołów w Narzędziach deweloperskich

Przejdź do sekcji Protocol Handlers (Moduły obsługi protokołów), klikając Aplikacja > Panel pliku manifestu. Dostępne opcje wyświetlić i przetestować wszystkie dostępne protokoły tutaj.

Na przykład zainstaluj tę demonstracyjną aplikację PWA. W Protocol Handlers, wpisz „americano”. i kliknij Test Protocol, aby otworzyć stronę dotyczącą kawy. w PWA.

Moduły obsługi protokołów w panelu manifestu

Prezentacja

Możesz zobaczyć wersję demonstracyjną rejestracji modułu obsługi protokołu URL na potrzeby aplikacji PWA w usłudze Glitch.

  1. Otwórz stronę https://protocol-handler.glitch.me/, zainstaluj PWA. Po zainstalowaniu załaduj aplikację ponownie. Przeglądarka zarejestrowała teraz PWA jako modułu obsługi protokołu web+coffee z systemem operacyjnym.
  2. W oknie z zainstalowaną aplikacją PWA kliknij link https://protocol-handler-link.glitch.me/. Dzięki temu otwórz nową kartę przeglądarki z 3 linkami. Kliknij pierwszy lub drugi etap (latte macchiato lub americano). Przeglądarka wyświetli komunikat z pytaniem, czy aplikacja jest obsługi protokołu dla protokołu web+coffee. Jeśli wyrazisz zgodę, aplikacja PWA otworzy się i wyświetli wybraną kawę.
  3. Aby porównać z tradycyjnym procesem, który korzysta z navigator.registerProtocolHandler(), kliknij kliknij przycisk Zarejestruj moduł obsługi protokołu w aplikacji PWA. Następnie na karcie przeglądarki kliknij trzeci link. (czaj). Tak samo pojawi się prompt, ale PWA otworzy się na karcie, a nie w oknie przeglądarki.
  4. Wyślij do siebie wiadomość w aplikacji zależnej od platformy, np. Skype w systemie Windows, z linkiem w rodzaju <a href="web+coffee://americano">Americano</a> i kliknij ją. Podobnie powinien otworzyć się zainstalowana aplikacja PWA.

Wersja demonstracyjna modułu obsługi protokołu URL z kartą przeglądarki z linkami po lewej stronie i samodzielnym oknem PWA po prawej.

Bezpieczeństwo

Ponieważ instalacja PWA wymaga kontekstu, obsługa protokołów dziedziczy to ustawienie. . Lista zarejestrowanych modułów obsługi protokołów nie jest w żaden sposób dostępna w sieci, nie można wykorzystać jako wektora odcisku cyfrowego.

Próby nawigacji niezainicjowane przez użytkownika

Próby nawigacji, które nie są inicjowane przez użytkownika, ale są automatyczne, mogą nie zostać otwarte aplikacji. Niestandardowy adres URL protokołu może być używany tylko w kontekście przeglądania najwyższego poziomu, ale nie można go używać na przykład .

Lista dozwolonych protokołów

Podobnie jak w registerProtocolHandler() dostępna jest lista dozwolonych protokołów, które aplikacje mogą rejestrować się nią zająć.

Przy pierwszym uruchomieniu PWA ze względu na wywołany protokół użytkownikowi wyświetla się z oknami uprawnień. W oknie dialogowym wyświetli się nazwa i pochodzenie aplikacji. Użytkownik zapyta użytkownika, czy aplikacja może obsługiwać linki z protokołu. Jeśli użytkownik odrzuci okno dialogowe z prośbą o uprawnienia, zarejestrowany moduł obsługi protokołów będzie ignorowany przez system operacyjny. Aby wyrejestrować protokół użytkownik musi odinstalować aplikację PWA, która go zarejestrowała. Przeglądarka też zostanie wyrejestrowana modułu obsługi protokołu, jeśli użytkownik wybierze opcję „Zapamiętaj mój wybór”. i wybiera „Nie zezwalaj”.

Prześlij opinię

Zespół Chromium chce poznać Twoje wrażenia dotyczące rejestracji modułu obsługi protokołu URL Progresywne aplikacje internetowe.

Opowiedz nam o konstrukcji interfejsu API

Czy jest coś, co nie działa w interfejsie API zgodnie z oczekiwaniami? Czy może brakuje tu metod lub właściwości potrzebne do realizacji pomysłu? Masz pytanie lub komentarz na temat zabezpieczeń model? Zgłoś problem ze specyfikacją w odpowiednim repozytorium GitHub lub dodaj swoje uwagi do do istniejącego problemu.

Zgłoś problem z implementacją

Czy wystąpił błąd związany z implementacją Chromium? Czy implementacja różni się od specyfikacji? Zgłoś błąd na new.crbug.com. Podaj jak najwięcej szczegółów. instrukcje dotyczące odtwarzania i wpisz UI>Browser>WebAppInstalls w sekcji Komponenty. . Usługa Glitch świetnie nadaje się do szybkiego i łatwego udostępniania poprawek.

Pokaż wsparcie dla interfejsu API

Czy planujesz użycie rejestracji modułu obsługi protokołu URL na potrzeby aplikacji PWA? Twoje publiczne wsparcie pomaga Zespół Chromium nadaje priorytet funkcjom i pokazuje innym dostawcom przeglądarek, jak ważne jest zapewnienie obsługi .

Poinformuj nas, jak zamierzasz korzystać z tego narzędzia w wątku poświęconym dysku WICG. Wyślij tweeta do @ChromiumDev za pomocą hashtagu #ProtocolHandler. i daj nam znać, gdzie i jak go używasz.

Podziękowania

Rejestracja modułu obsługi protokołu URL dla aplikacji PWA została zaimplementowana i określona przez Fabio Rocha Diego González Connor Moody i Samuel Tang z zespołu Microsoft Edge. Ten artykuł została sprawdzona przez Joe Medleya i Fabio Rocha. Baner powitalny: JJ Ying o Unsplash.