Passer au contenu principal
Dans ces exemples, nous utilisons le flux avec code d’autorisation pour authentifier un utilisateur et demander les autorisations nécessaires (scopes) ainsi que les jetons. Pour en savoir plus sur les paramètres de la requête ou pour apprendre à implémenter entièrement ce flux, consultez notre tutoriel : Ajouter l’ouverture de session à des applications Web classiques.

Authentifier un utilisateur et demander des claims standards

Dans cet exemple, nous voulons authentifier un utilisateur et obtenir des détails sur celui-ci qui nous permettront de personnaliser notre interface utilisateur. Pour ce faire, nous devons obtenir un qui contient le nom de l’utilisateur, son pseudonyme, sa photo de profil et son adresse courriel.
  1. Lancez le flux d’authentification en envoyant l’utilisateur vers l’URL d’autorisation : Remarquez que, dans cet exemple :
    • Le paramètre response_type contient une valeur :
      • code : comme nous utilisons le flux standard pour les applications Web, notre demande initiale vise à obtenir un code d’autorisation; lorsque nous demanderons nos jetons à l’aide de ce code, nous recevrons le jeton d’identité dont nous avons besoin pour l’authentification.
    • Le paramètre scope contient trois valeurs : les scopes OIDC demandés :
      • openid : pour indiquer que l’application compte utiliser OIDC afin de vérifier l’identité de l’utilisateur.
      • profile : pour obtenir name, nickname et picture.
      • email : pour obtenir email et email_verified.
  2. Une fois que l’utilisateur a consenti (au besoin) et qu’Auth0 l’a redirigé vers votre application, demandez les jetons.
  3. Extrayez le jeton d’identité de la réponse et décodez-le. Vous devriez voir les claims suivantes : Votre application peut maintenant récupérer les attributs de l’utilisateur et les utiliser pour personnaliser votre interface utilisateur.

Demander l’accès à une API personnalisée

Dans cet exemple, nous demandons un scope personnalisé pour une API de calendrier qui autorisera l’application appelante à lire les rendez-vous de l’utilisateur. Pour ce faire, nous voulons obtenir un contenant le scope approprié pour lire les rendez-vous à partir de l’API. Notez que la demande d’un jeton d’accès ne dépend pas de la demande d’un jeton d’identité. Avant d’utiliser une API personnalisée, vous devez connaître les scopes disponibles pour l’API que vous appelez. Si l’API personnalisée est sous votre contrôle, vous devez enregistrer à la fois votre application et votre API dans Auth0 et définir les scopes de votre API à l’aide de l’Auth0 Dashboard. Vous pouvez également utiliser les autorisations définies pour personnaliser l’invite de consentement pour vos utilisateurs.
  1. Lancez le flux d’autorisation en dirigeant l’utilisateur vers l’URL d’autorisation : Notez que dans cet exemple :
    • Le paramètre response_type inclut toujours une valeur :
      • code : puisque nous utilisons le flux d’application Web classique, notre demande initiale vise un code d’autorisation; lorsque nous demanderons nos jetons à l’aide de ce code, nous recevrons le Jeton d’accès que nous pourrons utiliser pour appeler notre API.
    • le paramètre scope inclut une valeur; le scope d’API demandé :
      • read:appointments : pour nous permettre de lire les rendez-vous de l’utilisateur à partir de l’API.
    • Le paramètre audience est nouveau et inclut une valeur :
      • L’identifiant unique de l’API à partir de laquelle nous voulons lire les rendez-vous de l’utilisateur.
  2. Comme dans l’exemple précédent, une fois que l’utilisateur a donné son consentement (au besoin) et qu’Auth0 a redirigé vers votre application, demandez des jetons.
  3. Extrayez le jeton d’accès de la réponse, puis appelez l’API en utilisant le jeton d’accès comme information d’identification.

Authentifier un utilisateur et demander des claims standard ainsi qu’un accès à une API personnalisée

Dans cet exemple, nous combinons nos deux exemples précédents pour authentifier un utilisateur, demander des claims standard et aussi demander un scope personnalisé pour une API de calendrier qui permettra à l’application appelante de lire les rendez-vous de l’utilisateur. Pour ce faire, obtenez deux jetons :
  • Jeton d’identité qui contient :
    • Nom de l’utilisateur
    • Surnom
    • Photo de profil
    • Renseignements sur le courriel
  • Jeton d’accès qui contient le scope approprié pour lire les rendez-vous à partir de l’API. Notez que la demande d’un jeton d’accès ne dépend pas de la demande d’un jeton d’identité.
Avant d’utiliser une API personnalisée, vous devez savoir quels scopes sont disponibles pour l’API que vous appelez. Si l’API personnalisée est sous votre contrôle, vous devez enregistrer à la fois votre application et l’API auprès d’Auth0 et définir les scopes de votre API à l’aide de l’Auth0 Dashboard. Vous pouvez aussi utiliser les autorisations définies pour personnaliser l’invite de consentement pour vos utilisateurs.
  1. Démarrez le flux d’authentification en envoyant l’utilisateur vers l’URL d’autorisation : Notez que, dans cet exemple :
    • Le paramètre response_type inclut toujours une seule valeur :
      • code : parce que nous utilisons le flux normal d’application Web, notre demande initiale vise un code d’autorisation; lorsque nous demanderons nos jetons à l’aide de ce code, nous recevrons à la fois le jeton d’identité dont nous avons besoin pour l’authentification et le jeton d’accès que nous pourrons utiliser pour appeler notre API.
    • Le paramètre scope est utilisé à la fois pour les scopes OIDC et les scopes d’API; il inclut donc maintenant quatre valeurs :
      • openid : pour indiquer que l’application a l’intention d’utiliser OIDC pour vérifier l’identité de l’utilisateur.
      • profile : pour obtenir name, nickname et picture.
      • email : pour obtenir email et email_verified.
      • read:appointments : pour nous permettre de lire les rendez-vous de l’utilisateur à partir de l’API.
    • Le paramètre audience inclut une valeur :
      • L’identifiant unique de l’API à partir de laquelle nous voulons lire les rendez-vous de l’utilisateur
  2. Comme dans les exemples précédents, après que l’utilisateur a donné son consentement (au besoin) et qu’Auth0 l’a redirigé vers votre application, demandez les jetons.
  3. Extrayez le jeton d’identité de la réponse, décodez-le, récupérez les attributs de l’utilisateur et utilisez-les pour personnaliser votre interface utilisateur.
  4. Extrayez le jeton d’accès de la réponse et appelez l’API en utilisant le jeton d’accès comme informations d’identification.

Ajouter des claims personnalisés à un jeton

Dans cet exemple, nous ajoutons la couleur préférée d’un utilisateur et son mode de contact préféré à l’ID Token. Pour ce faire, nous créons une Action pour personnaliser l’ID Token en y ajoutant ces claims. Une fois ajoutés, nous pourrons aussi récupérer les claims personnalisés en appelant le point de terminaison /userinfo (bien que l’Action ne s’exécute que pendant le processus d’authentification).
Auth0 permet les claims avec espace de noms et sans espace de noms, mais certaines restrictions s’appliquent (consultez Restrictions générales). Pour éviter les collisions de noms, nous recommandons d’utiliser des claims avec espace de noms. En cas de collision, la transaction n’échouera pas, mais votre claim personnalisé ne sera pas ajouté à vos jetons.
Supposons que :
  • À un moment donné, l’utilisateur a choisi la méthode preferred_contact email et la valeur favorite_color red, puis nous les avons enregistrées dans son user_metadata.
  • Nous avons utilisé la Management API ou le Dashboard pour définir des renseignements propres à l’application pour cet utilisateur.
Dans ce cas, le profil utilisateur normalisé stocké dans Auth0 est :
{
  "email": "jane@example.com",
  "email_verified": true,
  "user_id": "custom|123",
  "favorite_color": "blue",
  "user_metadata": {
    "preferred_contact": "email"
  }
}
Pour ce profil, Auth0 renverrait normalement à votre application les claims suivants de l’ID Token :
{
  "email": "jane@example.com",
  "email_verified": true,
  "iss": "https://my-domain.auth0.com/",
  "sub": "custom|123",
  "aud": "my_client_id",
  "iat": 1311280970,
  "exp": 1311281970
}
Notez que dans cet exemple :
  • La revendication sub contient la valeur de la propriété user_id.
  • Ni la propriété favorite_color ni la propriété user_metadata ne sont présentes, car Connect (OIDC) ne définit pas de claims standard pour représenter favorite_color ou user_metadata.
Pour recevoir ces données personnalisées, vous devrez créer une nouvelle Action afin de personnaliser le jeton avec des claims personnalisés représentant ces propriétés du profil de l’utilisateur.
  1. Accédez à Auth0 Dashboard > Actions > Library, puis sélectionnez Build Custom.
  2. Saisissez un Name descriptif pour votre Action (par exemple, Add user metadata to tokens), sélectionnez le déclencheur Login / Post Login puisque vous ajouterez l’Action au flux Login, puis sélectionnez Create.
  3. Repérez l’éditeur de code Actions, copiez-y le code JavaScript suivant, puis sélectionnez Save Draft pour enregistrer vos modifications :
    exports.onExecutePostLogin = async (event, api) => {
      const namespace = 'https://myapp.example.com';
      const { favorite_color, preferred_contact } = event.user.user_metadata;
    
      if (event.authorization) {
        // Définir les revendications 
        api.idToken.setCustomClaim(`${namespace}/favorite_color`, favorite_color);
        api.idToken.setCustomClaim(`${namespace}/preferred_contact`, preferred_contact);
      }
    };
    
  4. Dans la barre latérale de l’éditeur de code Actions, sélectionnez Test (icône de lecture), puis sélectionnez Run pour tester votre code.
  5. Lorsque vous êtes prêt à déployer l’Action, sélectionnez Deploy.
Enfin, ajoutez l’Action que vous avez créée au Login Flow. Pour savoir comment associer des Actions à des flux, consultez la section “Joindre l’Action à un flux” dans Write Your First Action. Lorsque cette Action est activée, Auth0 inclura les revendications personnalisées favorite_color et preferred_contact dans le ID Token :
{
  "email": "jane@example.com",
  "email_verified": true,
  "iss": "https://my-domain.auth0.com/",
  "sub": "custom|123",
  "aud": "my_client_id",
  "iat": 1311280970,
  "exp": 1311281970,
  "https://myapp.example.com/favorite_color": "red",
  "https://myapp.example.com/preferred_contact": "email"
}
Lorsque vous créez votre Action, assurez-vous de définir une logique qui détermine à quel moment inclure des claims supplémentaires. Injecter des claims personnalisés dans chaque ID Token émis n’est pas idéal. Cet exemple montre comment ajouter des claims personnalisés à un ID Token à l’aide de la méthode api.idToken.setCustomClaims. Pour ajouter ces claims à un Jeton d’accès, utilisez la méthode api.accessToken.setCustomClaim. Pour en savoir plus sur l’objet event du déclencheur, consultez Déclencheurs Actions : post-login - objet event. Pour en savoir plus sur les jetons, consultez Jetons.

Pour en savoir plus