Utiliser les Actions pour valider et stocker les données des utilisateurs finaux recueillies grâce aux personnalisations de l’invite d’inscription

Découvrez comment utiliser les Actions Auth0 pour valider et stocker les données des utilisateurs finaux.

Vous pouvez utiliser la personnalisation de l’invite d’inscription avec le déclencheur pre-user-registration pour ajouter à user_metadata les données fournies par l’utilisateur final dans l’invite d’inscription (comme son numéro de téléphone ou sa localisation). Au besoin, vous pouvez aussi valider ces données et afficher une erreur de validation dans l’invite.

​

Prérequis

• Le locataire a un Custom Domain vérifié
• Le locataire a un Page Template configuré

​

Ajouter un champ à l’invite d’inscription

Utilisez la Management API pour insérer un champ personnalisé dans un écran à l’aide de l’un des points d’entrée. Cet exemple ajoute le contenu suivant au point d’insertion ulp-container-form-content-start :

<div class="ulp-field">
  <label for="first-name">First Name</label>
  <input type="text" name="ulp-first-name" id="first-name">
</div>

Le résultat est une section du prénom dans l’invite d’inscription :

​

Créer une action dans le déclencheur de préinscription de l’utilisateur

Vous pouvez créer une action personnalisée de préinscription de l’utilisateur en accédant à Actions > Library > Build Custom.

Dans l’éditeur de code, mettez à jour le gestionnaire onExecutePreUserRegistration :

exports.onExecutePreUserRegistration = async (event, api) => {
  const firstName = event.request.body['ulp-first-name'];
  api.user.setUserMetadata("firstName", firstName);
};

Au besoin, vous pouvez valider la saisie de l’utilisateur et renvoyer une erreur de validation en appelant la méthode api.validation.error, puis déployer l’action :

exports.onExecutePreUserRegistration = async (event, api) => {
  const firstName = event.request.body['ulp-first-name'];
  if(!firstName) {
    api.validation.error("invalid_payload", "Missing first name");
    return;
  }

  api.user.setUserMetadata("firstName", firstName);
};

​

Ajouter l’action au flux

Accédez à Actions > Flows > Pre User Registration > Add Action > Custom, puis glissez-déposez votre nouvelle action dans le flux d’inscription et sélectionnez Apply.

​

Tester l’action

Inscrivez-vous pour créer un compte dans votre flux de test et laissez le champ First Name vide. Vous verrez un message d’erreur lors de l’envoi :

Après avoir saisi un nom dans le champ First Name, vous pourrez envoyer le formulaire avec succès :

​

Vérifiez que les données ont été enregistrées dans user_metadata

Accédez à User Management > Users, puis confirmez que les données ont bien été enregistrées en consultant l’onglet Details :