Krótki przewodnik

Peter Conn
Peter Conn

Konfiguracja zaufanych aktywności internetowych może być nieco skomplikowana, zwłaszcza jeśli aby Twoja witryna była wyświetlana. Z tego przewodnika dowiesz się, jak utworzyć podstawowy projekt wykorzystujący Trusted Web Activities, odkrywcy wszystkiego.

Po zakończeniu tego przewodnika:

  • użyli Bubblewrap do utworzenia aplikacji. które korzysta z zaufanej aktywności w internecie i przechodzi weryfikację.
  • Dowiedz się, kiedy są używane Twoje klucze podpisywania.
  • Musisz być w stanie określić podpis, z którego stworzona jest Twoja aplikacja na Androida.
  • Dowiedz się, jak utworzyć podstawowy plik Digital Asset Links.

Aby postępować zgodnie z tym przewodnikiem, musisz mieć:

  • Środowisko Node.js w wersji 10 lub nowszej zainstalowane na komputerze programistycznym.
  • Telefon z Androidem lub emulator podłączony i skonfigurowany na potrzeby programowania (Włącz debugowanie USB, jeśli (np. za pomocą telefonu fizycznego).
  • Przeglądarka obsługująca zaufaną aktywność w internecie na telefonie, którego używasz do programowania. Chrome w wersji 72 lub nowszej. Wkrótce zaczniemy obsługiwać również inne przeglądarki.
  • Strona, którą chcesz wyświetlić w ramach zaufanej aktywności internetowej.

Zaufana aktywność internetowa umożliwia aplikacji na Androida uruchamianie pełnoekranowej karty przeglądarki bez z dowolnego interfejsu przeglądarki. Ta funkcja jest dostępna tylko w witrynach należących do Ciebie. Możesz to potwierdzić, włączając do tworzenia linków Digital Asset Links. O nich porozmawiamy więcej na ten temat później.

Gdy uruchomisz zaufaną aktywność w internecie, przeglądarka sprawdzi, czy linki do zasobów cyfrowych Jest to tzw. weryfikacja. Jeśli weryfikacja się nie powiedzie, przeglądarka wyświetli witrynę jako Karta niestandardowa.

Instalowanie i konfigurowanie aplikacji Bubblewrap

Bubblewrap to zestaw bibliotek i polecenia narzędzie wiersza (CLI) dla Node.js, które pomaga programistom generować, tworzyć i uruchamiać progresywne aplikacje internetowe. w aplikacjach na Androida za pomocą zaufanej aktywności internetowej.

Interfejs wiersza poleceń można zainstalować za pomocą tego polecenia:

npm i -g @bubblewrap/cli

Konfigurowanie środowiska

Przy pierwszym uruchomieniu funkcji Bubblewrap proponuje automatyczne pobranie i zainstalowanie wymaganych zależności zewnętrznych. Zalecamy korzystanie z tej opcji przez narzędzie, ponieważ gwarantuje ono czy zależności są skonfigurowane prawidłowo. Zapoznaj się z dokumentacją folii bąbelkowej, by użyć istniejącą już instalację pakietu Java Development Kit (JDK) lub narzędzi wiersza poleceń na Androida.

Zainicjuj i skompiluj projekt

Projekt na Androida, który opakowuje PWA, odbywa się przy użyciu polecenia init:

bubblewrap init --manifest=https://my-twa.com/manifest.json

Funkcja Bubblewrap odczyta plik manifestu internetowego, poproś programistów o potwierdzenie wartości, które mają być używane w projekcie Androida, i wygeneruj projekt za pomocą tych wartości. Po wygenerowaniu projektu wygeneruj pakiet APK, uruchamiając polecenie:

bubblewrap build

Uruchom

Na etapie kompilacji wyświetli się plik o nazwie app-release-signed.apk. Ten plik można zainstalować w przeznaczone do testowania lub przesyłania do Sklepu Play w celu opublikowania.

Bubblewrap udostępnia polecenie pozwalające zainstalować i przetestować aplikację na urządzeniu lokalnym. Za pomocą urządzenie programistyczne podłączone do komputera, na którym działa:

bubblewrap install

Narzędzie adb można też .

adb install app-release-signed.apk

Aplikacja powinna być teraz dostępna w programie uruchamiającym urządzenia. Uruchamiając aplikację, że witryna została uruchomiona jako karta niestandardowa, a nie zaufana aktywność internetowa, bo nie skonfigurowano jeszcze weryfikacji linków do zasobów cyfrowych, ale najpierw...

Alternatywne interfejsy graficzne (GUI) dla Bubblewrap

Kreator PWA udostępnia interfejs GUI korzystający z Bubblewrap. do obsługi projektów Trusted Web Activity. Więcej instrukcji dotyczących użyj Kreatora aplikacji PWA, aby utworzyć aplikację na Androida, która będzie ją otwierać w tym poście na blogu.

Uwaga na temat kluczy podpisywania

Linki do zasobów cyfrowych uwzględniają klucz, którym został podpisany plik APK, a częstą przyczyną niepowodzenia weryfikacji jest użycie niewłaściwego podpisu. Pamiętaj, że nieudana weryfikacja wiąże się z otwarciem witryny w formie karty niestandardowej z interfejsem przeglądarki u góry strony. Podczas kompilacji aplikacji Bubblewrap zostanie utworzony plik APK z konfiguracją klucza w kroku init. Jednak gdy opublikujesz aplikację w Google Play, może zostać utworzony inny klucz w zależności od wybranej przez Ciebie metody obsługi kluczy podpisywania. Dowiedz się więcej o kluczach podpisywania i ich związku z Bubblewrap i Google Play.

Linki do zasobów cyfrowych składają się z pliku w witrynie, który wskazuje aplikację, metadanych w aplikacji, które wskazują na Twoją witrynę.

Po utworzeniu pliku assetlinks.json prześlij go do swojej witryny pod adresem .well-known/assetlinks.json względem katalogu głównego), aby przeglądarka mogła zweryfikować aplikację. Zapoznaj się ze szczegółowym omówieniem linków Digital Asset Links, aby dowiedzieć się, jaki mają one związek z Twoim kluczem podpisywania.

Sprawdzam Twoją przeglądarkę

Zaufana aktywność internetowa będzie próbowała stosować się do domyślnego wyboru przeglądarki użytkownika. Jeśli domyślna przeglądarka użytkownika obsługuje zaufane działania internetowe, zostanie uruchomiona. Jeśli tego nie zrobisz, zostanie wybrana, jeśli którakolwiek z zainstalowanych przeglądarek obsługuje zaufane działania internetowe. I ostatnim, domyślnym działaniem jest powrót do trybu kart niestandardowych.

Oznacza to, że jeśli debugujesz coś związanego z zaufanymi działaniami internetowymi, upewnij się, że używasz tej, którą zamierzasz. Aby sprawdzić, która przeglądarka jest używana, możesz użyć tego polecenia:

> adb logcat -v brief | grep -e TWAProviderPicker
D/TWAProviderPicker(17168): Found TWA provider, finishing search: com.google.android.apps.chrome

Następne kroki

Jeśli po zapoznaniu się z tym przewodnikiem, masz zaufaną aktywność w internecie, umiejętności pozwalające na debugowanie sytuacji, gdy weryfikacja się nie powiedzie. Jeśli nie, zapoznaj się z innymi pomysłami na Androida dla programistów stron internetowych lub zgłoś problem na GitHubie te dokumenty.

Następnym krokiem jest dla Ciebie utworzyć ikonę aplikacji. Gdy to zrobisz, możesz rozważyć wdrożenie aplikacji w Sklepie Play.