Przeglądanie w aplikacji za pomocą osadzonej przeglądarki

Przeglądarki w aplikacjach zapewniają użytkownikom pełne korzystanie z internetu bez konieczności opuszczania aplikacji. Android oferuje 2 główne interfejsy API do implementowania przeglądarek w aplikacjach: karty niestandardowe i komponenty WebView. Używaj przeglądarki w aplikacji, gdy masz link lub reklamę, która prowadzi do strony internetowej. Możesz otworzyć tę stronę bezpośrednio w aplikacji, jak widać na rysunku 1.

Link w aplikacji w czerwonym polu i strzałka wskazująca inny ekran, na którym widać link otwarty na karcie niestandardowej.
Rysunek 1. Kliknięcie linku w aplikacji (po lewej) i otwarcie przeglądarki w aplikacji za pomocą karty niestandardowej (po prawej).

Wybór między kartami niestandardowymi a komponentami WebView to ważna decyzja architektoniczna, która wpływa na szybkość tworzenia aplikacji, wygodę użytkowników i stopień kontroli nad interfejsem.

Szybkie porównanie

W tabeli poniżej znajdziesz informacje, które pomogą Ci zdecydować, które narzędzie będzie dla Ciebie odpowiednie:

Funkcja WebView Karty niestandardowe
Główny przypadek użycia Tworzenie aplikacji hybrydowych, w których internet jest głównym lub pomocniczym źródłem treści, wyświetlanie reklam, kampanie w aplikacji lub strony z warunkami korzystania z usługi. Wyświetlanie treści z zewnętrznych witryn (np. artykułów lub stron produktów).
Element sterujący interfejsu Pełna. Jest to komponent View, który możesz umieścić w dowolnym miejscu. Masz kontrolę nad całym otaczającym interfejsem. Ograniczona. Możesz zmienić kolor paska narzędzi i dodać kilka niestandardowych działań.
Dane i sesje W izolowanym środowisku. Nie udostępnia plików cookie ani danych logowania głównej przeglądarce użytkownika. Udostępniane. Używa domyślnej sesji przeglądarki użytkownika, w tym plików cookie i zapisanych haseł.
Mostek między aplikacją natywną a internetem Tak. Możesz użyć mostka JavaScript do głębokiej, dwukierunkowej komunikacji między treściami internetowymi a kodem aplikacji natywnej. Ograniczona. Do podstawowego przekazywania ciągów znaków możesz użyć metody window.postMessage().
Nakład pracy dewelopera Duży. Musisz samodzielnie zarządzać cyklem życia, nawigacją i wydajnością. Mały. Możesz zaimplementować go za pomocą kilku linii kodu.

WebView

WebView to widok, który sprawia, że strony internetowe stają się integralną częścią układu aplikacji. Jest to potężne narzędzie, ale jego obsługa jest nieco bardziej złożona niż w przypadku kart niestandardowych.

WebView może wczytywać zdalne lub lokalne treści internetowe, wykonywać JavaScript i umożliwiać dwukierunkową komunikację między treściami internetowymi a kodem aplikacji natywnej. Więcej informacji o jego możliwościach znajdziesz w artykule Co potrafi WebView.

Możesz też użyć WebView do udostępniania aplikacji internetowej lub wyświetlania strony internetowej online jako części aplikacji. Może to być np. umowa z użytkownikiem, którą musisz okresowo aktualizować. Więcej informacji znajdziesz w artykule Tworzenie aplikacji internetowych w WebView.

Dlaczego warto wybrać WebView

Oto kilka sytuacji, w których WebView jest dobrym rozwiązaniem:

  • Aplikacje hybrydowe: tworzysz aplikację, w której treści internetowe i komponenty natywne (np. pasek nawigacyjny lub pływający przycisk działania) znajdują się obok siebie.
  • Treści własne: treści internetowe są podstawową, interaktywną częścią aplikacji, np. edytor dokumentów lub obszar projektowania.
  • Pełna kontrola interfejsu: musisz zmodyfikować zawartość samej strony internetowej lub nałożyć na nią natywne elementy interfejsu.
  • Szczegółowe analizy: potrzebujesz szczegółowych informacji o zaangażowaniu i aktywności użytkowników w widoku internetowym.

Główne kompromisy

Oto kilka głównych kompromisów, które należy wziąć pod uwagę podczas korzystania z WebView:

  • Wydajność: WebView może zużywać dużo pamięci. Jeśli nie będziesz nim starannie zarządzać, możesz napotkać problemy z wydajnością lub błędy ANR (aplikacja nie odpowiada).
  • Bezpieczeństwo i konserwacja: odpowiadasz za zwiększenie bezpieczeństwa i zarządzanie cyklem życia. Obejmuje to zarządzanie zachowaniem stanu podczas ponownego tworzenia procesu za pomocą WebViewCompat.saveState() i przestrzeganie limitu 1 MB na transakcję zapisanego stanu w Androidzie. Aktualizacje WebView są jednak udostępniane globalnie w Google Play, więc nie musisz się martwić, że podstawowy silnik będzie nieaktualny.

Karty niestandardowe

Karty niestandardowe to doskonały wybór, jeśli chcesz kierować użytkowników do zewnętrznych adresów URL, ponieważ zapewniają szybkie, bezpieczne i przyjazne dla użytkownika okno przeglądarki, które przesuwa się nad aplikacją.

Dlaczego warto wybrać karty niestandardowe

Oto kilka sytuacji, w których karty niestandardowe są dobrym rozwiązaniem:

  • Linki zewnętrzne: gdy użytkownik kliknie link do witryny, której nie jesteś właścicielem, karty niestandardowe utrzymują go w kontekście Twojej aplikacji, zapewniając jednocześnie pełne korzystanie z przeglądarki.
  • Łatwość integracji: jest to najprostszy sposób na uruchomienie osadzonego środowiska internetowego.
  • Stan udostępniony: ponieważ karty niestandardowe udostępniają pliki cookie domyślnej przeglądarce użytkownika, użytkownicy nie muszą ponownie logować się w witrynach, które już odwiedzili.
  • Logowanie przez inne firmy: karty niestandardowe dobrze sprawdzają się w przypadku logowania przez inne firmy (np. „Zaloguj się przez Google” lub „Zaloguj się przez Facebooka”), ponieważ przeglądarka bezpiecznie obsługuje dane logowania.

Większość przeglądarek obsługuje karty niestandardowe, ale niektóre oferują więcej możliwości dostosowania niż inne. Więcej informacji znajdziesz w sekcji Obsługiwane przeglądarki.

Używanie treści internetowych w Jetpack Compose

Podczas tworzenia aplikacji za pomocą Jetpack Compose możesz używać zarówno kart niestandardowych, jak i WebView:

  • Karty niestandardowe: ponieważ karty niestandardowe używają Intent, możesz je uruchamiać z dowolnego Context w funkcjach Compose, co zapewnia bezproblemową integrację.
  • WebView: Compose nie ma jeszcze natywnego komponentu WebView, więc musisz użyć AndroidView, aby osadzić standardowy komponent WebView w układzie.

Dodatkowe materiały

Aby tworzyć strony internetowe na urządzenia z Androidem za pomocą interfejsów WebView lub Custom Tabs API, zapoznaj się z tymi dokumentami: