Passer au contenu principal
À l’heure actuelle, les efforts de développement d’Auth0 sont axés sur Universal Login, et Classic Login n’est plus mis à jour. À moins que votre cas d’utilisation n’exige l’expérience Classic, nous vous recommandons d’implémenter Universal Login. Pour comparer les fonctionnalités des différentes expériences de connexion, consultez Universal Login vs. Classic Login.
Nous vous recommandons de migrer l’implémentation de votre écran Classic Login vers Universal Login à l’aide d’Advanced Customizations for Universal Login (ACUL).

Avant de commencer

Vous avez besoin de ce qui suit :
  • Un locataire de développement Auth0 configuré avec Universal Login et un domaine personnalisé.
  • Auth0 CLI installé et configuré avec votre locataire de développement.
  • Un dépôt GitHub pour héberger vos écrans de connexion personnalisés ACUL.
  • Un inventaire des ressources de votre expérience Classic Login :
    • Composants d’interface utilisateur.
    • Jetons CSS/de thème et ressources de marque.
    • Règles de validation (format du courriel, champs obligatoires).
    • Comportement de gestion des erreurs.

Initialiser un projet ACUL

Si vous n’avez pas configuré votre locataire de développement à l’aide d’Auth0 CLI, utilisez la commande auth0 login.
Accédez à l’emplacement où vous voulez créer votre projet ACUL, puis exécutez la commande suivante :
auth0 acul init acul-login --screens login-id,login-password
Auth0 CLI initialise votre projet avec les écrans d’authentification prédéfinis login-id et login-password. Pour en savoir plus, consultez ACUL d’Auth0 sur GitHub.

Personnaliser les écrans ACUL

Personnalisez les écrans login-id et login-password pour les adapter aux normes de votre organisation. Tenez compte des éléments suivants :
  • Réutilisez le CSS/thème et les composants React existants.
    • Appliquez l’image de marque (ressources, typographie, mise en page).
    • Ajoutez une validation de base côté client (courriel requis/format ; mot de passe requis).
    • Uniformisez la présentation des erreurs (cohérente et accessible).
Vous pouvez développer vos écrans ACUL localement pour les personnaliser à l’aide de la commande :
auth0 acul dev
Pour en savoir plus, consultez le document Processus de développement ACUL.

Valider la migration ACUL

Pour valider le parcours de connexion complet de l’utilisateur, vous pouvez utiliser la commande auth0 acul :
auth0 acul dev --connected
Vous devez tester et vous assurer de ce qui suit :
  • Le flux d’authentification utilise votre interface utilisateur personnalisée pour les écrans login-id et login-password, et ceux-ci s’affichent correctement.
    • Les messages d’erreur liés à un mot de passe incorrect et les autres messages d’erreur côté serveur s’affichent clairement.
    • Les utilisateurs sont redirigés avec succès vers votre application.
    • La validation du courriel, si elle est activée, fonctionne comme prévu.
Pour en savoir plus, consultez les tests d’intégration ACUL sur un locataire réel.

Déployer des écrans ACUL dans un locataire de production

Le projet d’écrans ACUL comprend une configuration de déploiement que vous pouvez utiliser comme point de départ pour déployer vos écrans en production. Les étapes de déploiement d’ACUL comprennent :
  • La création des paquets de ressources de vos écrans.
    • Leur publication sur votre CDN.
    • L’activation d’ACUL dans votre locataire Auth0 de production.
Pour en savoir plus, consultez le processus de déploiement d’ACUL.

En savoir plus