Skonfigurowanie zaufanych aktywności w internecie może być trudne, zwłaszcza jeśli chcesz tylko wyświetlać swoją witrynę. Z tego przewodnika dowiesz się, jak utworzyć mały projekt, który korzysta z zaufanych aktywności w internecie.
Po przeczytaniu tego przewodnika:
- używać Bubblewrap do tworzenia aplikacji, która korzysta z zaufanej aktywności internetowej i przechodzi weryfikację;
- Dowiedz się, kiedy są używane klucze podpisywania.
- możliwość określenia podpisu, za pomocą którego tworzona jest aplikacja na Androida;
- Wiedzieć, jak utworzyć podstawowy plik Digital Asset Links.
Aby skorzystać z tego przewodnika, potrzebujesz:
- Node.js w wersji 10 lub nowszej.
- Telefon lub emulator z Androidem połączony i skonfigurowany do programowania. Włącz debugowanie USB, jeśli używasz fizycznego telefonu.
- przeglądarkę mobilną obsługującą zaufaną aktywność internetową,
- Witryna, którą chcesz wyświetlić w zaufanej aktywności internetowej.
W przypadku aplikacji na Androida możesz użyć zaufanej aktywności internetowej, aby uruchomić kartę przeglądarki na pełnym ekranie bez interfejsu przeglądarki. Ta funkcja jest dostępna tylko w przypadku witryn, których jesteś właścicielem. Własność możesz potwierdzić, konfigurując Digital Asset Links.
Gdy uruchamiasz zaufaną aktywność internetową, przeglądarka weryfikuje linki Digital Asset Links. Jeśli weryfikacja się nie powiedzie, przeglądarka wyświetli Twoją witrynę jako kartę niestandardową.
Instalowanie i konfigurowanie Bubblewrap
Bubblewrap to zestaw bibliotek i narzędzie wiersza poleceń (CLI) dla Node.js, które pomaga deweloperom generować, tworzyć i uruchamiać progresywne aplikacje internetowe w aplikacjach na Androida za pomocą zaufanej aktywności internetowej.
Zainstaluj interfejs wiersza poleceń, uruchamiając to polecenie:
npm i -g @bubblewrap/cli
Konfigurowanie środowiska
Przy pierwszym uruchomieniu narzędzie Bubblewrap oferuje automatyczne pobranie i zainstalowanie wymaganych zależności zewnętrznych. Zalecamy włączenie automatycznego pobierania, ponieważ pomaga to prawidłowo skonfigurować zależności. Aby użyć istniejącej instalacji pakietu Java Development Kit (JDK) lub narzędzi wiersza poleceń Androida, zapoznaj się z dokumentacją Bubblewrap.
Inicjowanie i tworzenie projektu
Zainicjuj projekt aplikacji na Androida, który opakowuje PWA:
bubblewrap init --manifest=https://my-twa.com/manifest.json
Bubblewrap odczytuje plik manifestu aplikacji internetowej, prosi deweloperów o potwierdzenie wartości, które mają być użyte w projekcie aplikacji na Androida, i generuje projekt na podstawie tych wartości.
Po wygenerowaniu projektu wygeneruj pakiet APK, uruchamiając to polecenie:
bubblewrap build
Uruchom
Krok kompilacji generuje plik o nazwie app-release-signed.apk. Ten plik można zainstalować na urządzeniu deweloperskim w celu przetestowania lub przesłać do Sklepu Play w celu opublikowania.
Bubblewrap udostępnia polecenie do instalowania i testowania aplikacji na urządzeniu lokalnym. Gdy urządzenie deweloperskie jest podłączone do komputera, uruchom:
bubblewrap install
Możesz też użyć narzędzia adb.
adb install app-release-signed.apk
Aplikacja powinna być teraz dostępna w programie uruchamiającym na urządzeniu.
Po otwarciu aplikacji zobaczysz, że Twoja witryna jest uruchamiana jako karta niestandardowa, a nie zaufana aktywność internetowa. Dzieje się tak, ponieważ nie skonfigurowaliśmy jeszcze weryfikacji Digital Asset Links.
Alternatywne graficzne interfejsy użytkownika (GUI) dla Bubblewrap
PWA Builder udostępnia interfejs GUI, który korzysta z biblioteki Bubblewrap do generowania projektów zaufanej aktywności internetowej. Instrukcje tworzenia aplikacji na Androida, która otwiera Twoją aplikację PWA, za pomocą narzędzia PWA Builder znajdziesz tutaj.
Klucze podpisywania
Digital Asset Links uwzględniają klucz, którym podpisano plik APK, a częstą przyczyną niepowodzenia weryfikacji jest użycie nieprawidłowego podpisu. (Pamiętaj, że jeśli weryfikacja się nie powiedzie, witryna zostanie uruchomiona jako karta niestandardowa z interfejsem przeglądarki u góry strony). Gdy Bubblewrap utworzy aplikację, zostanie utworzony plik APK z kluczem skonfigurowanym w init kroku. Gdy opublikujesz aplikację w Google Play, może zostać utworzony dla Ciebie inny klucz w zależności od tego, jak chcesz zarządzać kluczami podpisywania. Dowiedz się więcej o kluczach podpisywania i ich związku z Bubblewrap i Google Play.
Konfigurowanie pliku linków do komponentów
Digital Asset Links to w zasadzie plik w Twojej witrynie, który wskazuje Twoją aplikację, oraz metadane w aplikacji, które wskazują 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 prawidłowo zweryfikować aplikację. Więcej informacji o tym, jak to się odnosi do klucza podpisywania, znajdziesz w szczegółowym omówieniu Digital Asset Links.
Sprawdzanie przeglądarki
Zaufana aktywność internetowa będzie próbować dostosować się do domyślnej przeglądarki użytkownika. Jeśli domyślna przeglądarka użytkownika obsługuje zaufane działania w internecie, zostanie uruchomiona. Jeśli to się nie uda, zostanie wybrana dowolna zainstalowana przeglądarka obsługująca zaufane działania w internecie. Domyślnie przeglądarka przechodzi w tryb kart niestandardowych.
Oznacza to, że jeśli debugujesz coś związanego z zaufanymi działaniami w internecie, musisz upewnić się, że używasz przeglądarki, która Twoim zdaniem jest odpowiednia. 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
Dalsze kroki
Jeśli udało Ci się przejść przez ten przewodnik, masz już działającą zaufaną aktywność w internecie i wystarczającą wiedzę, aby rozwiązać problemy, jeśli weryfikacja się nie powiedzie. Jeśli nie, zapoznaj się z koncepcjami dotyczącymi Androida dla programistów stron internetowych.
Następnie utwórz ikonę aplikacji. Gdy to zrobisz, możesz rozważyć wdrożenie aplikacji w Sklepie Play.