Określ, jak objęte raportowaniem linki mają otwierać Twoją PWA w ramach deklaratywnej rejestracji linków

Thomas Steiner

Czym jest deklaratywne rejestrowanie linków?

Klikanie linków w internecie może być czasem miłą niespodzianką. Na przykład kliknięcie linku do strony internetowej YouTube na urządzeniu mobilnym powoduje otwarcie aplikacji YouTube na iOS lub Androida, jeśli jest zainstalowana. Gdy jednak zainstalujesz aplikację PWA YouTube na komputerze i klikniesz link, otworzy się ona na karcie przeglądarki.

Sprawa się komplikuje. Co się stanie, jeśli link nie wyświetla się na stronie, ale w wiadomości czatu otrzymanej w jednej z aplikacji Google do czatowania? W systemach operacyjnych na komputery, które wyznaczają oddzielne okna aplikacji, czy po każdym kliknięciu linku tworzyć nowe okno lub kartę, jeśli aplikacja jest już otwarta? Istnieje wiele sposobów rejestrowania linków i nawigacji, w tym między innymi:

Deklaracyjne przechwytywanie linków to oferta usługi w pliku manifestu aplikacji internetowej o nazwie "capture_links", która umożliwia deweloperom deklaratywne określenie, co ma się stać, gdy przeglądarka zostanie poproszona o przejście do adresu URL znajdującego się w zakresie nawigacji aplikacji z kontekstu spoza zakresu nawigacji. Oferta nie ma zastosowania, jeśli użytkownik znajduje się już w zakresie nawigacji (np. jeśli ma otwartą w przeglądarce kartę z zakresu i kliknie link wewnętrzny).

Niektóre warunki specjalne, takie jak kliknięcie linku środkowym (lub kliknięcie prawym przyciskiem myszy, a potem kliknięcie przycisku „Otwórz w nowej karcie”), zwykle nie mogą aktywować funkcji rejestrowania linków. To, czy link to target=_self czy target=_blank, nie ma znaczenia, więc linki klikane w oknie przeglądarki (lub oknie innej aplikacji PWA) są otwierane w PWA, nawet jeśli normalnie powoduje to nawigację w tej samej karcie.

Sugerowane przypadki użycia

Przykłady witryn, w których można używać tego interfejsu API:

  • PWA, które po kliknięciu przez użytkownika linku otwierają okno, a nie kartę przeglądarki. W środowisku komputerowym często dobrze jest mieć otwartych wiele okien aplikacji jednocześnie.
  • Progresywne aplikacje PWA z jednym oknem, w których deweloper chce, aby w danym momencie otwarte było tylko 1 instancja aplikacji, a nowe elementy nawigacyjne koncentrują się na istniejącej instancji. Podzapytania to m.in.:
    • Aplikacje, w przypadku których działa tylko jedna instancja (np. odtwarzacz muzyki, gra).
    • aplikacje, które umożliwiają zarządzanie wieloma dokumentami w ramach jednej instancji (np. pasek kart zaimplementowany w języku HTML).

Włączanie na stronie about://flags

Aby eksperymentować z lokalnym przechwytywaniem linków za pomocą deklaratywnego przechwytywania linków bez tokena próbnego origin, w interfejsie about://flags włącz flagę #enable-desktop-pwas-link-capturing.

Jak korzystać z deklaratywnego rejestrowania linków?

Deweloperzy mogą deklaratywnie określić sposób przechwytywania linków, korzystając z dodatkowego pola "capture_links" manifestu aplikacji internetowej. Jego wartością jest ciąg lub tablica ciągów tekstowych. Jeśli podana jest tablica ciągów tekstowych, klient użytkownika wybiera pierwszy obsługiwany element na liście (domyślnie "none"). Obsługiwane są te wartości:

  • "none" (ustawienie domyślne): brak przechwytywania linków; kliknięte linki prowadzące do tego zakresu aplikacji PWA prowadzą do tego zakresu w zwykły sposób bez otwierania okna PWA.
  • "new-client": każdy kliknięty link otwiera nowe okno PWA pod tym adresem URL.
  • "existing-client-navigate": kliknięty link otwiera się w istniejącym oknie PWA (jeśli takie okno jest dostępne) lub w nowym oknie, jeśli nie. Jeśli istnieje więcej niż 1 okno PWA, przeglądarka może wybrać jedno z nich według własnego uznania. Jeśli żadne okno nie jest otwarte, odpowiada to działaniu "new-client". 🚨 Ostrożnie! Ta opcja może prowadzić do utraty danych, ponieważ strony można dowolnie opuścić. Właściciele witryn powinni mieć świadomość, że zgadzają się na takie działania, wybierając tę opcję. Ta opcja najlepiej sprawdza się w witrynach „tylko do odczytu”, które nie przechowują danych użytkownika w pamięci, np. w odtwarzaczach muzyki. Jeśli strona, z której następuje przekierowanie, zawiera zdarzenie beforeunload, użytkownik zobaczy tę prośbę przed zakończeniem nawigacji.
.

Pokaz

Prezentacja funkcji deklaratywnego przechwytywania linków składa się z 2 wersji demonstracyjnych, które współdziałają:

  1. https://continuous-harvest-tomato.glitch.me/
  2. https://hill-glitter-tree.glitch.me/

Ten screencast poniżej pokazuje, jak te 2 elementy współdziałają ze sobą. Występują 2 różne zachowania: "new-client" i "existing-client-navigate". Przetestuj aplikacje w różnych stanach, uruchomione na karcie lub w zainstalowanej aplikacji PWA, aby zobaczyć różnice w ich działaniu.

Zabezpieczenia i uprawnienia

Zespół Chromium opracował i wdrożył deklarację przechwytywania linków, opierając się na podstawowych zasadach zdefiniowanych w artykule Kontrolowanie dostępu do zaawansowanych funkcji platformy internetowej, takich jak kontrola użytkownika, przejrzystość i ergonomia. Ten interfejs API udostępnia witrynom nowe dodatkowe opcje kontroli. Po pierwsze możliwość automatycznego otwierania zainstalowanych aplikacji w oknie. Wykorzystuje on istniejący interfejs użytkownika, ale umożliwia witrynie jego automatyczne aktywowanie. Po drugie, możliwość zaznaczenia bieżącego okna we własnej domenie i uruchomienia zdarzenia zawierającego kliknięty adres URL. Ma to na celu umożliwienie witrynie przejścia z istniejącego okna na nową stronę, zastępując domyślny proces nawigacji w języku HTML.

Migracja do interfejsu Launch Handler API

Okres próbny interfejsu deklaratywnego linku przechwytywania linków wygasł 30 marca 2022 r. w przypadku Chromium 97 i starszych wersji. Zastąpimy ją zestawem nowych funkcji i interfejsów API w Chromium w wersji 98 i nowszych, takich jak przechwytywanie linków włączanych przez użytkowników oraz interfejs Launch Handler API.

W Chromium 98 automatyczne przechwytywanie linków jest teraz działaniem użytkownika, a nie przyznawaniem aplikacji internetowej podczas instalacji. Aby włączyć przechwytywanie linków, użytkownik musi uruchomić zainstalowaną aplikację z poziomu przeglądarki, klikając Otwórz w, i wybrać Zapamiętaj mój wybór.

Przykład ustawienia „Otwórz w” w zainstalowanej aplikacji z włączoną opcją „Zapamiętaj mój wybór”.

Użytkownicy mogą też włączyć lub wyłączyć przechwytywanie linków w określonej aplikacji internetowej na stronie ustawień zarządzania aplikacjami.

Przykład strony ustawień zainstalowanej aplikacji

Przechwytywanie linków to obecnie funkcja dostępna tylko w ChromeOS. Pracujemy nad obsługą systemów Windows, macOS i Linux.

Uruchom interfejs Handler API

Kontrola nad przychodzącymi elementami nawigacyjnym jest przenoszona do interfejsu Launch Handler API, który pozwala aplikacjom internetowym decydować o sposobie uruchamiania aplikacji internetowych w różnych sytuacjach, takich jak przechwytywanie linków, udostępnianie miejsca docelowego czy obsługa plików. Aby przeprowadzić migrację z interfejsu Deklaative Link Capturing API do interfejsu Launch Handler API:

  1. Zarejestruj swoją witrynę w testowej wersji origin mechanizmu obsługi uruchamiania i umieść w aplikacji internetowej klucz testowy origin.

  2. Dodaj wpis "launch_handler" do pliku manifestu witryny.

    • Aby użyć funkcji "capture_links": "new-client", dodaj:"launch_handler": { "route_to": "new-client" }.
    • Aby użyć funkcji "capture_links": "existing-client-navigate", dodaj: "launch_handler": { "route_to": "existing-client-navigate" }.
    • Aby używać interfejsu "capture_links": "existing-client-event" (który nigdy nie został wdrożony w ramach testowania źródła deklaratywnego przechwytywania linków), dodaj: "launch_handler": { "route_to": "existing-client-retain" }. Po włączeniu tej opcji strony należące do zakresu aplikacji nie będą już nawigować automatycznie po zarejestrowaniu nawigacji po linkach. Aby umożliwić nawigację, musisz obsługiwać plik LaunchParams w języku JavaScript, wywołując window.launchQueue.setConsumer().

Pole capture_links i rejestracja na potrzeby testowania źródła deklaratywnego przechwytywania linków będą ważne do 30 marca 2022 r. Dzięki temu użytkownicy Chromium 97 i starszych wersji będą mogli uruchamiać aplikację internetową za pomocą przechwyconego linku.

Więcej informacji znajdziesz w artykule Kontrolowanie sposobu uruchamiania aplikacji.

Prześlij opinię

Zespół Chromium chce poznać Twoją opinię o rejestrowaniu linków.

Opowiedz nam o projekcie interfejsu API

Czy interfejs API nie działa zgodnie z oczekiwaniami? A może brakuje metod lub właściwości, które potrzebujesz do realizacji swojego pomysłu? Masz pytanie lub komentarz na temat modelu bezpieczeństwa? Zgłoś problem ze specyfikacją w odpowiednim repozytorium GitHub lub dodaj swoje uwagi na temat istniejącego problemu.

Zgłoś problem z implementacją

Czy wystąpił błąd w implementacji Chromium? A może implementacja różni się od specyfikacji? Zgłoś błąd na new.crbug.com. Podaj jak najwięcej szczegółów i proste instrukcje dotyczące odtwarzania oraz wpisz UI>Browser>WebAppInstalls w polu Komponenty. Usterki to świetny sposób na udostępnianie szybkich i łatwych replik.

Pokaż obsługę interfejsu API

Czy zamierzasz korzystać z deklaratywnego przechwytywania linków? Twoja publiczna pomoc pomaga zespołowi Chromium priorytetowo traktować funkcje i pokazuje innym dostawcom przeglądarek, jak ważne jest ich wsparcie.

Wyślij tweeta na adres @ChromiumDev, używając hashtagu #DeclarativeLinkCapturing, i daj nam znać, gdzie i w jaki sposób go używasz.

Przydatne linki

Podziękowania

Deklarowane przechwytywanie linków zostało określone przez Matta Giuca, korzystając z danych pochodzących od Alana Cuttera i Dominicka Ng. Interfejs API zaimplementował Alan Cutter. Ten artykuł napisali Joe Medley, Matt Giuca, Alan Cutter i Shunya Shishido. Baner powitalny autorstwa: Zulmaury Saavedra w serwisie Unsplash.