Découvrez l’extension d’association de compte, qui permet d’inviter les utilisateurs ayant deux comptes avec la même adresse de courriel à les lier.
Ainsi, l’extension d’association de compte invite les utilisateurs qui pourraient avoir créé un deuxième compte par erreur à lier le nouveau compte à leur ancien lors de leur première connexion. L’utilisateur peut alors choisir de lier les deux comptes ou de les garder séparés si cela était intentionnel.
L’extension se déclenche après l’authentification lorsque l’adresse courriel de l’utilisateur qui s’est authentifié correspond à l’adresse de courriel d’un compte utilisateur existant associé à un autre fournisseur d’identité.Par exemple, si un utilisateur se connecte avec son compte Facebook en utilisant le courriel john@acme.com, puis s’authentifie auprès de Google en utilisant la même adresse courriel, il verra une page similaire à celle-ci :
L’extension ne lie pas automatiquement les comptes créés avec la même adresse de courriel, même si cette adresse est vérifiée, car il ne s’agit pas d’un élément suffisant pour prouver que l’utilisateur peut actuellement s’authentifier dans les deux comptes.Si l’utilisateur sélectionne Continuer, il sera redirigé vers la page Facebook pour s’authentifier. Si l’utilisateur est déjà connecté, la page Facebook le redirigera vers l’application et le compte de l’utilisateur sera automatiquement lié. S’il n’est pas connecté, il sera invité à s’authentifier avec ses identifiants Facebook. Une fois que Facebook le redirige vers Auth0, le compte Facebook sera lié au compte Google. Ce processus garantit que l’utilisateur dispose des informations d’identification pour s’authentifier sur les deux comptes, ce qui permet de les lier en toute sécurité et de la bonne manière.
Accédez à Auth0 Dashboard > Extensions, puis sélectionnez Association de compte Auth0. La fenêtre Installer l’extension s’ouvre.L’extension créera une nouvelle application nommée auth0-account-link à utiliser en interne et une nouvelle règle pour rediriger les utilisateurs vers l’extension s’ils se connectent avec un nouveau compte dont l’adresse de courriel correspond à un compte existant.
Si vous effectuez une rotation du secret client de l’application associée à l’extension de lien de compte, vous devez désinstaller l’extension, la réinstaller et la reconfigurer avec le nouveau secret de l’application.
Pour effectuer un test, créez un modèle React d’application à page unique avec ce projet.Ouvrez le fichier auth_config.json dans votre éditeur de texte et mettez à jour les identifiants du domaine et le client_id avec vos informations.Ajoutez http://localhost:3000 aux champs « URL de rappel autorisées », « URL de déconnexion autorisées » et « Origines Web autorisées ».Connectez-vous à http://localhost:3000 et sélectionnez une connexion. Saisissez une adresse courriel déjà associée à un utilisateur vérifié avec un type de connexion différent.Pour lier le compte, sélectionnez Continuer.Une fois connecté, vérifiez les détails de l’utilisateur sur . Ici, nous pouvons voir que les comptes utilisateurs sont liés.
Nous vous recommandons de modifier le nom de l’application utilisé par défaut pour l’extension par un nom descriptif qui sera facile à lire pour vos clients, comme Association de compte, car ce nom sera affiché sur la Page de connexion lorsqu’ils s’authentifieront dans leur compte principal.
Par défaut, la connexion universelle d’Auth0 permet à un utilisateur de s’inscrire et de se connecter, comme on peut s’y attendre. Cependant, lorsque la fonction d’association de comptes vous demande de vous authentifier dans votre compte principal afin de le lier au nouveau compte, l’affichage d’une option d’inscription peut être source de confusion pour les utilisateurs.Pour en savoir plus sur ce que vous pouvez faire avec la Connexion universelle, consultez Connexion universelle Auth0.Pour éviter cela, nous envoyons un paramètre de requête pour informer la page de connexion qu’elle doit masquer l’option Inscription. Cependant, pour que ce paramètre de requête prenne effet, vous devez personnaliser la page de connexion.
Activez le commutateur Personnaliser la page de connexion pour activer l’éditeur personnalisé ci-dessous. Dans l’éditeur, nous allons ajouter une nouvelle ligne à la configuration Lock.
Vers le bas de l’objet de configuration du gadget logiciel Lock, ajoutez la ligne suivante (après le paramètre closable) :
allowSignUp: !config.extraParams.prevent_sign_up,
Enregistrez vos modifications et essayez de lier un compte. Vous remarquerez que l’option Inscription n’est plus présente et que vos utilisateurs ne risquent plus d’être confus.
Le masquage du lien d’inscription n’est pas pris en charge dans l’expérience de connexion universelle.
Lors de l’installation (ou à tout moment par la suite en cliquant sur l’icône Paramètres pour l’extension d’association de compte), vous pouvez ajouter un URL à une feuille de style personnalisée si vous souhaitez personnaliser la page d’extension et lui donner un aspect différent du thème par défaut.
Vous serez redirigé vers le site d’administration. Vous pouvez y modifier le code HTML de la page hébergée et modifier certains paramètres du gadget logiciel de liaison de compte tels que le titre, le logo, la couleur et la langue.
Ne pas supprimer {{ ExtensionCSS }}, {{ CustomCSS }}, {{ Auth0Widget }}, ou {{ ExtensionScripts }} du code HTML du site. Cela empêcherait l’extension d’afficher le widget d’association de comptes.
Si vous utilisez un domaine personnalisé, vous devez définir la règle de configuration customDomain en fonction du domaine personnalisé (p. ex., auth.custom.com).
Par défaut, la ligne 27 de la règle est :
issuer: auth0.domainVous devrez modifier cette ligne par :
issuer: "myCustomDomain.com"
Assurez-vous d’omettre la partie protocole de l’URL.
