Comment : Utiliser le remplissage automatique des mots de passe dans votre application

Posté le 21. juin 2024 par Jan Bunk

Un robot humanoïde avec une grande clé déverrouillant une porte de coffre-fort, art numérique

Si votre site web dispose d'un système de compte où les utilisateurs peuvent se connecter, vous souhaitez rendre le processus de connexion aussi pratique que possible. Bien sûr, cela s'applique également à votre application, puisqu'elle inclura la même page de connexion.

La meilleure opportunité de réduire les frictions pendant le processus de connexion est de s'assurer que les utilisateurs restent connectés automatiquement via les cookies. Cela fonctionne de la même manière dans l'application que sur votre site web, donc vous n'avez rien à faire de plus si cela fonctionne déjà sur votre site web. Cela réduit considérablement le nombre de fois où l'utilisateur doit se connecter, mais l'utilisateur doit toujours se connecter la première fois qu'il utilise l'application ou chaque fois que les cookies expirent. Pour cette raison, nous devrions toujours essayer de rendre ces connexions rapides et faciles.

Un moyen important d'y parvenir est de permettre aux gens d'utiliser leurs gestionnaires de mots de passe. De cette façon, ils peuvent facilement insérer leur nom d'utilisateur et leur mot de passe enregistrés et n'ont pas à les taper ou à les copier/coller. Il y a quelques points à surveiller ici, c'est ce que nous allons examiner dans cet article.

Le configurer sur votre site web

Pour que les fonctionnalités de remplissage automatique fonctionnent dans votre application, elles doivent d'abord fonctionner sur votre site web. Si vous utilisez un constructeur de site web, cela devrait fonctionner automatiquement. Si vous écrivez le HTML vous-même, assurez-vous de définir les attributs nécessaires sur vos éléments d'entrée. Ce n'est pas l'objectif de ce guide, je le mentionne principalement pour que vous vous souveniez de vérifier la configuration de votre site web si vous avez des problèmes avec le remplissage automatique des mots de passe dans votre application. La meilleure façon de tester si cela fonctionne sur votre site web est d'ouvrir votre site web dans Chrome sur un appareil Android et dans Safari sur un appareil iOS. Si l'enregistrement et le remplissage automatique des détails de connexion fonctionnent bien là-bas, votre site web devrait être correctement configuré.

Configuration iOS

Malheureusement, Apple limite la fonctionnalité des gestionnaires de mots de passe à l'intérieur des applications basées sur des sites web. Pour être précis, par défaut, le composant WebView (qui est le navigateur intégré de l'application qui affiche votre site web) ne peut ni enregistrer de nouveaux mots de passe ni insérer des noms d'utilisateur et des mots de passe précédemment enregistrés. C'est bien sûr ennuyeux pour les utilisateurs comme nous l'avons déjà discuté. Heureusement, nous pouvons réduire cette frustration au moins partiellement, car avec un peu de configuration supplémentaire, l'insertion des mots de passe enregistrés fonctionnera.

Pour activer cette fonctionnalité, vous devez configurer des liens d'application pour votre application. Les liens d'application et cette fonctionnalité de remplissage automatique nécessitent tous deux que vous vérifiiez que votre application et votre site web appartiennent ensemble. Comme ils n'ont aucun inconvénient, nous les avons regroupés pour que vous les activiez tous les deux en même temps, ce qui est plus facile.

Veuillez noter que même dans ce cas, les utilisateurs ne peuvent insérer que des identifiants précédemment enregistrés. L'enregistrement de nouveaux identifiants ne fonctionne toujours que dans Safari. Cela est dû à une restriction d'Apple et est le même pour le trousseau iOS et les autres gestionnaires de mots de passe.

Une fois configuré, les utilisateurs pourront accéder à leurs mots de passe enregistrés via le clavier. Voici à quoi cela ressemble lors de l'utilisation de l'application iOS Keychain :

Une capture d'écran du clavier iOS proposant de remplir automatiquement les détails de connexion via l'application Keychain.

Et voici une capture d'écran de ce que vous voyez lorsque vous utilisez un gestionnaire de mots de passe tiers, dans ce cas LastPass :

Une capture d'écran du clavier iOS proposant de remplir automatiquement les détails de connexion enregistrés pour l'application webtoapp.design en utilisant LastPass.

Notes d'utilisation pour Android

Sur Android, vous n'avez pas besoin de faire de configurations supplémentaires. Les utilisateurs seront invités à enregistrer/remplir leurs mots de passe par défaut, par exemple par le gestionnaire de mots de passe Google :

Une capture d'écran du gestionnaire de mots de passe Google proposant d'enregistrer le mot de passe qui vient d'être utilisé pour se connecter. Une capture d'écran du clavier Android proposant de remplir automatiquement les détails de connexion enregistrés dans le gestionnaire de mots de passe Google.

Les gestionnaires de mots de passe tiers peuvent ou non prendre en charge le remplissage des mots de passe dans les applications basées sur des sites web. Par exemple, LastPass fonctionne :

Une capture d'écran du gestionnaire de mots de passe LastPass proposant d'enregistrer le mot de passe qui vient d'être utilisé pour se connecter. Une capture d'écran d'une fenêtre contextuelle LastPass proposant de remplir automatiquement les détails de connexion enregistrés pour l'application webtoapp.design.

Mais d'autres gestionnaires de mots de passe comme Bitwarden ne fonctionnent pas, car les développeurs de Bitwarden doivent activer manuellement le remplissage automatique pour chaque application et c'est désactivé par défaut.

Gardez à l'esprit que cette fonctionnalité peut également apparaître différemment en fonction de la variante d'Android que vous utilisez. Des marques comme Samsung et Xiaomi modifient fortement la version d'Android qu'elles utilisent, donc cette fonctionnalité peut également sembler un peu différente sur ces appareils.

Articles connexes


Un robot humanoïde avec un chronomètre physique surveillant un atelier de robots travaillant à des bureaux, art numérique

Nous avons publié 238 applications - Voici combien de temps a pris la révision des applications

Nous avons publié beaucoup d'applications et suivi le temps qu'il a fallu pour les mettre dans les magasins d'applications, y compris les temps de rejet et de resoumission des applications.

Image avec texte : Préparer votre compte développeur Apple pour la mise à jour de votre application existante

Étapes nécessaires pour que nous puissions mettre à jour votre application iOS existante

Ce guide vous explique toutes les étapes à suivre pour nous permettre de mettre à jour votre application déjà publiée dans l'App Store d'Apple.

Image avec texte : Préparation de la mise à jour de votre application existante sous Android

Étapes à suivre avant de mettre à jour votre ancienne application sous Android

Dans ce guide, vous apprendrez à trouver toutes les informations nécessaires pour mettre à jour votre application existante sous Android qui a été créée par un autre développeur. Par exemple, nous vous montrerons où trouver le nom du bundle et les clés de signature.


Auteur Jan Bunk
Écrit par
Jan Bunk

Bonjour, je m'appelle Jan ! J'ai créé webtoapp.design en 2019 alors que j'étudiais l'informatique à l'université. Beaucoup de choses ont changé depuis - non seulement j'ai obtenu mon diplôme, mais ce n'est plus seulement moi qui dirige webtoapp.design. Nous sommes devenus une équipe mondiale, entièrement à distance, et nous avons accumulé beaucoup d'expérience autour du développement et de la publication d'applications. Nous avons créé et publié des centaines d'applications dans les magasins d'applications, où elles ont été téléchargées des centaines de milliers de fois.