Comment configurer les éléments Auth0 pour refléter votre image de marque et l’expérience utilisateur souhaitée.
Auth0 peut être personnalisé pour adopter une apparence conforme aux exigences d’image de marque de votre organisation et aux attentes des utilisateurs. La personnalisation de l’image de marque des éléments Auth0 offre une expérience utilisateur cohérente à vos clients et les rassure en leur montrant qu’ils utilisent un produit provenant d’un fournisseur fiable et sécurisé.Auth0 prend en charge l’internationalisation (I18N) et la localisation (L10N), deux aspects importants si vous travaillez l’image de marque pour une clientèle internationale. Les éléments fournis prêts à l’emploi, comme le widget d’interface utilisateur Auth0 Lock et , prennent déjà en charge plusieurs langues, avec une extensibilité intégrée pour en ajouter d’autres si ce dont vous avez besoin n’existe pas déjà.
Presque toutes les applications ont besoin d’internationalisation et/ou de localisation d’une façon ou d’une autre. Auth0 facilite leur ajout, mais vous devez en tenir compte dès le départ : adapter la localisation après coup, par exemple, peut s’avérer fastidieux si vous attendez trop longtemps.
Lorsque vous déterminez quels éléments vous souhaitez personnaliser à votre image de marque, ainsi que la meilleure façon de le faire, vous devriez examiner plusieurs points :
Devez-vous personnaliser l’image de marque de votre page de connexion ?
Devez-vous localiser votre page de connexion ?
Si vous partagez un locataire Auth0 entre plusieurs organisations clientes, devez-vous ajouter une image de marque propre à chaque organisation à leur expérience de connexion ?
Comment pouvez-vous personnaliser les courriels pour qu’ils ne soient pas seulement aux couleurs de votre marque, mais qu’ils varient aussi selon les préférences des utilisateurs ?
Comment les utilisateurs sauront-ils qu’ils sont toujours sur votre domaine lorsqu’ils verront votre page de connexion ?
Que devez-vous faire pour offrir une sécurité supplémentaire dans le navigateur (par ex., mettre en œuvre la validation étendue) ?
Où voulez-vous rediriger les utilisateurs en cas d’erreur ?
Auth0 offre une grande souplesse pour personnaliser et configurer les pages Auth0, comme Universal Login et Réinitialisation du mot de passe. Vous pouvez donc essentiellement mettre en place l’apparence et l’expérience utilisateur dont vous avez besoin. Pour beaucoup, l’expérience prête à l’emploi — avec peut-être quelques ajustements — suffit. Pour d’autres, toutefois, la valeur de leur marque et sa notoriété exigent une personnalisation plus poussée. Cette souplesse s’étend non seulement aux pages Auth0, mais, grâce à l’extensibilité, peut aussi s’appliquer aux modèles de courriel. La fonctionnalité Domaine personnalisé d’Auth0 renforce encore la confiance des consommateurs en rassurant les utilisateurs sur les plans de la sûreté et de la sécurité.Si vous partagez un locataire Auth0 entre plusieurs organisations clientes, en fournissant à chacune son propre domaine d’utilisateurs et en gérant leurs identifiants, vous devrez réfléchir à la façon dont chaque utilisateur saura quels identifiants utiliser et comment il pourra avoir confiance qu’il les saisit à un endroit sûr et sécurisé. Consultez Personnaliser l’image de marque de la connexion par organisation pour en savoir plus.Bien qu’Auth0 fournisse des renseignements par défaut en cas d’erreur, les renseignements prêts à l’emploi peuvent être quelque peu cryptiques, puisqu’ils ne contiennent pas le contexte que vous seul pouvez fournir. Les directives d’Auth0 sur la personnalisation de la page d’erreur peuvent toutefois aider à atténuer ce problème en vous permettant de fournir des renseignements plus contextuels par l’intermédiaire de votre propre équipe de soutien.
Pour fournir des ressources utiles aux utilisateurs qui rencontrent des problèmes, vous devriez également configurer un nom convivial et un logo, ainsi que fournir l’adresse courriel et l’URL de soutien de votre organisation. Pour savoir comment faire, consultez Paramètres du locataire dans le Dashboard.
Universal Login est la méthode recommandée pour authentifier les utilisateurs, et il s’articule autour de l’utilisation de la page de connexion. Vous pouvez personnaliser la page de connexion pour qu’elle respecte les exigences d’image de marque de votre organisation.
Pour personnaliser les pages d’Universal Login, vous pouvez modifier vos thèmes de page et créer des modèles de page dynamiques.Si vous choisissez de mettre en œuvre Classic Login et de personnaliser le script de la page de connexion, nous vous recommandons fortement d’utiliser le contrôle de version. Pour ce faire, vous devriez déployer le script dans votre locataire Auth0 à l’aide de l’automatisation du déploiement ou de l’une des stratégies de rechange.
Personnaliser l’image de marque de la connexion par organisation
Le besoin d’effectuer ou non une personnalisation particulière sur la page Universal Login dépend de la façon dont vous comptez gérer les organisations de vos clients. Avant de lire cette section, assurez-vous d’avoir lu la section Universal Login et de bien comprendre votre approche des organisations en consultant Multiple Organization Architecture.Si les utilisateurs de vos organisations sont tous isolés les uns des autres, il est important d’indiquer clairement sur la page Universal Login à quelle organisation la page de connexion correspond. Le moyen le plus simple d’y parvenir consiste à utiliser la fonctionnalité Organizations, qui vous permet d’enregistrer un logo, une couleur principale et une couleur d’arrière-plan. Ces éléments serviront à personnaliser l’image de marque sur la page Universal Login une fois l’organisation identifiée, soit en transmettant org_id depuis l’application, soit lorsque l’utilisateur saisit son organisation dans l’invite d’organisation.
Par défaut, l’URL associée à votre locataire comprend son nom et, dans certains cas, un identifiant propre à une région. Par exemple, les locataires hébergés aux États-Unis ont une URL du type https://example.us.auth0.com, tandis que ceux hébergés en Europe ont une URL du type https://example.eu.auth0.com. Un Domaine personnalisé vous permet d’offrir à vos utilisateurs une expérience cohérente en utilisant un nom aligné sur l’image de marque de votre organisation.
Un seul nom de domaine personnalisé peut être appliqué par locataire Auth0. Donc, si vous devez absolument avoir une image de marque distincte pour chaque nom de domaine, vous aurez besoin d’une architecture dans laquelle plusieurs locataires Auth0 sont déployés en production.
De plus, la fonctionnalité vous offre un contrôle complet sur le processus de gestion des certificats. Par défaut, Auth0 fournit des certificats SSL standard, mais si vous configurez un domaine personnalisé, vous pouvez utiliser des certificats SSL à validation étendue (EV) ou l’équivalent afin d’offrir à vos visiteurs des indicateurs visuels dans le navigateur qui renforcent leur confiance.En général, nous constatons que les clients obtiennent les meilleurs résultats lorsqu’ils utilisent un domaine centralisé pour l’authentification, surtout si l’entreprise offre plusieurs produits ou marques de service. En utilisant un domaine centralisé, vous pouvez offrir aux utilisateurs finaux une expérience cohérente tout en limitant le besoin de maintenir plusieurs locataires de production dans Auth0.
Si les organisations de vos clients doivent être isolées les unes des autres et que les utilisateurs doivent voir une page de connexion propre à chaque organisation au moyen d’une URL de domaine personnalisé, votre seule option est de créer un locataire distinct pour chaque organisation.
Auth0 utilise abondamment le courriel, tant pour envoyer des notifications aux utilisateurs que pour prendre en charge les fonctionnalités nécessaires à une gestion sécurisée des identités (par exemple, la vérification du courriel, la récupération de compte et les protections contre les attaques par force brute), et Auth0 fournit plusieurs modèles à cette fin.
Avant de personnaliser les modèles de courriel, veuillez configurer votre fournisseur de courriel.
Par défaut, les modèles de courriel comprennent un texte standard et l’image de marque d’Auth0. Cependant, vous pouvez configurer presque tous les aspects de ces modèles afin qu’ils reflètent le texte et l’expérience utilisateur que vous souhaitez, et modifier des éléments comme la langue préférée, les options d’accessibilité, etc.Les modèles de courriel sont personnalisés à l’aide de la syntaxe Liquid. Si vous souhaitez personnaliser vos modèles en fonction des préférences des utilisateurs, vous aurez également accès aux métadonnées figurant dans les profils des utilisateurs, ainsi qu’aux métadonnées propres à l’application.
Personnalisation de la page de réinitialisation du mot de passe
La page Réinitialisation du mot de passe est utilisée chaque fois qu’un utilisateur se sert de la fonctionnalité de changement de mot de passe et, comme pour la page de connexion, vous pouvez la personnaliser pour qu’elle reflète les exigences particulières de votre organisation en matière d’image de marque.Si les utilisateurs de votre organisation sont tous isolés les uns des autres (c.-à-d. que chaque organisation dispose de sa propre connexion de base de données Auth0) et que vous personnalisez l’image de marque des pages Universal Login par organisation, il est également important de faire de même pour des éléments comme la page de réinitialisation du mot de passe afin que les utilisateurs sachent pour quelle organisation le changement de mot de passe est effectué. Cela peut se faire de plusieurs façons :
Ajoutez du code JavaScript à la page Réinitialisation du mot de passe pour charger des ressources depuis un CDN en fonction du paramètre de connexion qui indique de quelle organisation provient l’utilisateur.
Créez un locataire distinct pour une organisation et utilisez Universal Login pour personnaliser l’expérience selon les besoins de cette organisation.
Si des problèmes surviennent pendant le parcours interactif de l’utilisateur (p. ex., l’inscription ou la connexion), Auth0 fournit des messages d’erreur qui indiquent la nature du problème sous-jacent. Les messages par défaut sont assez cryptiques, surtout pour l’utilisateur final, puisqu’il lui manque souvent le contexte que vous seul pouvez fournir. Nous vous recommandons donc de personnaliser vos pages d’erreur afin de fournir directement à vos utilisateurs l’information contextuelle manquante. De plus, la personnalisation de vos pages d’erreur vous permet d’afficher votre image de marque, et non celle d’Auth0, tout en donnant à vos utilisateurs des indications utiles sur la marche à suivre. Cette information peut inclure un lien vers une FAQ ou des instructions pour communiquer avec l’équipe de soutien ou le centre d’assistance de votre entreprise.
Par défaut, il n’existe pas d’interface utilisateur permettant de personnaliser les pages d’erreur fournies par Auth0, mais vous pouvez utiliser le point de terminaison Tenant Settings de la Management API pour les configurer. Sinon, si vous pouvez créer et héberger votre propre page d’erreur, vous pouvez faire en sorte qu’Auth0 y redirige les utilisateurs au lieu d’utiliser l’option hébergée par Auth0.
Personnalisation des pages Guardian d’authentification multifacteur
Les pages de peuvent être personnalisées en ajustant les options d’image de marque d’Universal Login dans la section Paramètres d’Universal Login.Si vous avez besoin d’une personnalisation plus poussée, vous pouvez aussi personnaliser le contenu HTML complet afin de refléter les exigences UX particulières de votre organisation.
Nous mettons à votre disposition un guide de planification au format PDF que vous pouvez télécharger et consulter pour en savoir plus sur les stratégies que nous recommandons.Guide de planification du projet B2B IAM