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

Les navigateurs intégrés 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 : les onglets personnalisés et les WebView. 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 vous pouvez le voir sur la figure 1.

Un lien intégré à une application dans une boîte rouge, avec une flèche pointant vers un autre écran montrant le lien ouvert avec un onglet personnalisé.
Figure 1. Cliquez sur un lien intégré (à gauche) et ouvrez un navigateur intégré dans l'application à l'aide d'un onglet personnalisé (à droite).

Le choix entre les onglets personnalisés et les WebView 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'interface utilisateur.

Comparatif rapide

Utilisez le tableau suivant pour vous aider à choisir l'outil qui répond à vos besoins :

Fonctionnalité WebView Onglets de personnalisation
Utilisation principale Créer des applications hybrides avec le Web comme contenu principal ou d'assistance, afficher des annonces, des campagnes intégrées ou des pages de conditions d'utilisation. Afficher du contenu provenant de sites Web externes (comme des articles d'actualité ou des pages de produits).
Contrôle de l'interface utilisateur Complet. 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é. Vous pouvez définir le thème de la couleur de la barre d'outils et ajouter quelques actions personnalisées.
Données et sessions En bac à sable. Il ne partage pas les cookies ni les identifiants avec le navigateur principal de l'utilisateur. Partagées. Il utilise la session de 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 d'application natif. Limité. Vous pouvez utiliser la méthode window.postMessage() pour le transfert de chaînes de base.
Efforts du développeur Élevés. Vous devez gérer vous-même le cycle de vie, la navigation et les performances. Faibles. Vous pouvez l'implémenter en quelques lignes de code seulement.

WebView

Une WebView est une vue qui fait des pages Web une partie intégrale de la mise en page de votre application. Elle est puissante, 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 d'application natif. Pour en savoir plus sur ses fonctionnalités, consultez Que peut faire WebView ?.

Vous pouvez également utiliser WebView pour fournir une application Web ou afficher une page Web en ligne dans votre application. Par exemple, un contrat d'utilisateur final 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 un bon choix :

  • 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 une partie interactive essentielle de l'expérience dans l'application, comme un éditeur de documents ou un canevas de conception.
  • Contrôle complet 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'informations détaillées sur l'engagement utilisateur et l'activité dans la vue Web.

Principaux compromis

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

  • Performances : WebView peut utiliser beaucoup de mémoire. Si vous ne la gérez pas avec soin, vous risquez de rencontrer des problèmes de performances ou des erreurs ANR (App Not Responding).
  • Sécurité et maintenance : vous êtes responsable du renforcement de la sécurité et de la gestion du cycle de vie. Toutefois, les mises à jour de WebView sont déployées à l'échelle mondiale 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 un excellent choix pour rediriger les utilisateurs vers des URL externes, car ils fournissent une fenêtre de navigateur rapide, sécurisée et conviviale qui glisse sur votre application.

Pourquoi choisir les onglets personnalisés ?

Voici quelques scénarios dans lesquels les onglets personnalisés sont un bon choix :

  • 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 offrant une expérience de navigateur complète.
  • Facilité d'intégration : il s'agit du moyen le plus simple de mettre en place 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 : ils sont bien adaptés 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 Compatibilité avec les navigateurs.

Utiliser du contenu Web dans Jetpack Compose

Vous pouvez utiliser à la fois les onglets personnalisés et WebView lorsque vous créez des applications 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 transparente.
  • 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 des onglets personnalisés, consultez les documents suivants :