Navigation dans l'application à l'aide du Web intégré

Les navigateurs intégrés à l'application offrent à vos utilisateurs une expérience Web complète sans qu'ils aient à quitter votre application. Android propose deux API principales pour implémenter des navigateurs intégrés à l'application : les onglets personnalisés et les WebViews. Utilisez un navigateur intégré dans l'application lorsque vous avez un lien ou une annonce qui redirige vers une page Web. Vous pouvez ouvrir cette page directement dans votre application, comme illustré dans la figure 1.

Lien intégré à l'application dans un encadré rouge, et flèche pointant vers un autre écran montrant le lien ouvert avec un onglet personnalisé.
Figure 1. Clic sur un lien dans l'application (à gauche) et ouverture d'un navigateur intégré dans l'application à l'aide d'un onglet personnalisé (à droite).

Le choix entre les onglets personnalisés et les WebViews est une décision architecturale importante qui affecte la vitesse de développement, l'expérience utilisateur et le niveau de contrôle que vous avez sur l'UI.

Comparatif rapide

Utilisez le tableau suivant pour déterminer l'outil qui répond à vos besoins :

Fonctionnalité WebView Onglets de personnalisation
Cas d'utilisation principal Créer des applications hybrides avec le Web comme contenu principal ou secondaire, afficher des annonces display, des campagnes pour applications ou des pages de conditions d'utilisation. Afficher du contenu provenant de sites Web externes (comme des articles d'actualités ou des pages produit).
commande d'interface utilisateur Full. Il s'agit d'un composant View que vous pouvez placer n'importe où. Vous contrôlez l'ensemble de l'interface utilisateur environnante. Limitée. Vous pouvez personnaliser la couleur de la barre d'outils et ajouter quelques actions personnalisées.
Données et sessions Sandboxed. Il ne partage pas les cookies ni les connexions avec le navigateur principal de l'utilisateur. Partagé. Il utilise la session du navigateur par défaut de l'utilisateur, y compris les cookies et les mots de passe enregistrés.
Pont natif <-> Web Oui. Vous pouvez utiliser un pont JavaScript pour une communication bidirectionnelle approfondie entre le contenu Web et le code de l'application native. Limitée. Vous pouvez utiliser la méthode window.postMessage() pour transmettre des chaînes de base.
Effort des développeurs Élevé Vous devez gérer vous-même le cycle de vie, la navigation et les performances. Faible Vous pouvez l'implémenter avec seulement quelques lignes de code.

WebView

Une WebView est une vue qui intègre des pages Web à la mise en page de votre application. Il est puissant, mais un peu plus complexe à gérer que les onglets personnalisés.

WebView peut charger du contenu Web distant ou local, exécuter du code JavaScript et permettre une communication bidirectionnelle entre votre contenu Web et le code de l'application native. Pour en savoir plus sur ses fonctionnalités, consultez Ce que WebView peut faire.

Vous pouvez également utiliser WebView pour diffuser une application Web ou afficher une page Web en ligne dans votre application (par exemple, un contrat d'utilisation que vous devez mettre à jour régulièrement). Pour en savoir plus, consultez Créer des applications Web dans WebView.

Pourquoi choisir WebView ?

Voici quelques scénarios dans lesquels WebView est une bonne solution :

  • Applications hybrides : vous créez une application dans laquelle le contenu Web et les composants natifs (comme une barre de navigation ou un bouton d'action flottant) coexistent.
  • Contenu propriétaire : votre contenu Web est un élément central et interactif de l'expérience dans l'application, comme un éditeur de documents ou un canevas de conception.
  • Contrôle total de l'interface utilisateur : vous devez modifier le contenu de la page Web elle-même ou superposer des éléments d'interface utilisateur natifs.
  • Analyses approfondies : vous avez besoin d'insights détaillés sur l'engagement utilisateur et l'activité des utilisateurs dans la vue Web.

Principaux compromis

Voici quelques compromis clés à prendre en compte lorsque vous utilisez WebView :

  • Performances : WebView peut consommer beaucoup de mémoire. Si vous ne le gérez pas avec soin, vous risquez de rencontrer des problèmes de performances ou des erreurs ANR (Application Not Responding).
  • Sécurité et maintenance : vous êtes responsable du renforcement de la sécurité et de la gestion du cycle de vie. Cela inclut la gestion de la conservation de l'état lors de la recréation du processus à l'aide de WebViewCompat.saveState() et le respect de la limite de transaction d'état enregistré d'Android (1 Mo). Toutefois, les mises à jour de WebView sont déployées dans le monde entier via Google Play. Vous n'avez donc pas à vous soucier de l'obsolescence du moteur sous-jacent.

Onglets de personnalisation

Les onglets personnalisés sont une excellente option pour rediriger les utilisateurs vers des URL externes, car ils fournissent une fenêtre de navigateur rapide, sécurisée et conviviale qui s'affiche par-dessus votre application.

Pourquoi choisir les onglets personnalisés ?

Voici quelques scénarios dans lesquels les onglets personnalisés sont adaptés :

  • Liens externes : lorsqu'un utilisateur appuie sur un lien vers un site Web qui ne vous appartient pas, les onglets personnalisés le maintiennent dans le contexte de votre application tout en lui offrant une expérience de navigation complète.
  • Facilité d'intégration : c'est le moyen le plus simple de configurer et d'exécuter une expérience Web intégrée.
  • État partagé : comme il partage les cookies avec le navigateur par défaut de l'utilisateur, celui-ci n'a pas besoin de se reconnecter aux sites qu'il a déjà visités.
  • Connexion tierce : elles sont bien adaptées aux flux de connexion tiers (comme "Se connecter avec Google" ou "Se connecter avec Facebook"), car le navigateur gère les identifiants de manière sécurisée.

Bien que la plupart des navigateurs soient compatibles avec les onglets personnalisés, certains offrent plus de personnalisation que d'autres. Pour en savoir plus, consultez Navigateurs compatibles.

Utiliser du contenu Web dans Jetpack Compose

Vous pouvez utiliser à la fois les onglets personnalisés et WebView lorsque vous créez une application avec Jetpack Compose :

  • Onglets personnalisés : comme les onglets personnalisés utilisent un Intent, vous pouvez les lancer à partir de n'importe quel Context dans vos fonctions Compose, ce qui permet une intégration fluide.
  • WebView : Compose ne dispose pas encore d'un composable WebView natif. Vous devez donc utiliser AndroidView pour intégrer une WebView standard dans votre mise en page.

Ressources supplémentaires

Pour développer des pages Web pour les appareils Android à l'aide des API WebView ou Custom Tabs, consultez les documents suivants :