Partager via

Scénario : Application native appelant une API web

Découvrez comment créer une application native pour connecter des utilisateurs authentifiés par AD FS 2019 et acquérir des jetons à l’aide de la bibliothèque MSAL pour appeler des API web.

Avant de lire cet article, vous devez vous familiariser avec les concepts d’AD FS et le flux d’octroi du code d’autorisation.

Vue d’ensemble

Vue d’ensemble

Dans ce flux, vous ajoutez une authentification à votre application native (client public), qui peut alors connecter des utilisateurs et appeler une API web. Pour appeler une API web à partir d’une application native qui connecte des utilisateurs, vous pouvez utiliser la méthode d’acquisition de jeton AcquireTokenInteractive de MSAL. Pour permettre cette interaction, MSAL utilise un navigateur web.

Pour mieux comprendre comment configurer une application native dans AD FS afin d’acquérir un jeton d’accès de manière interactive, nous allons utiliser un exemple disponible ici et parcourir pas à pas les étapes d’inscription de l’application et de configuration du code.

Conditions préalables

  • Outils clients GitHub
  • AD FS 2019 (ou version ultérieure) configuré et en cours d’exécution
  • Visual Studio 2013 ou une version ultérieure

Inscription d’application dans AD FS

Cette section montre comment inscrire l’application native en tant que client public et l’API web en tant que partie de confiance dans AD FS.

  1. Dans Gestion AD FS, cliquez avec le bouton droit sur Groupes d’applications et sélectionnez Ajouter un groupe d’applications.

  2. Dans l’Assistant Groupe d’applications, pour Nom, entrez NativeAppToWebApi, puis sous Applications client-serveur, sélectionnez le modèle Application native accédant à une API web. Cliquez sur Suivant.

    Capture d’écran de la page d’accueil de l’Assistant Ajout d’un groupe d’applications montrant l’application native accédant à un modèle d’API web mise en évidence.

  3. Copiez la valeur d’Identificateur du client. Nous l’utiliserons ultérieurement comme valeur pour ClientId dans le fichier App.config de l’application. Entrez ce qui suit pour URI de redirection :https://ToDoListClient. Cliquez sur Add. Cliquez sur Suivant.

    Capture d’écran de la page Application native de l’Assistant Ajout d’un groupe d’applications montrant l’URI de redirection.

  4. Dans l’écran Configurer l’API web, entrez Identificateur :https://localhost:44321/. Cliquez sur Add. Cliquez sur Suivant. Cette valeur sera utilisée plus tard dans les fichiers App.config et Web.Config de l’application.

    Capture d’écran de la page Configurer l’API web de l’Assistant Ajout d’un groupe d’applications montrant l’identificateur correct.

  5. Sur l’écran Appliquer la stratégie de contrôle d’accès, sélectionnez Autoriser tout le monde, puis cliquez sur Suivant.

    Capture d’écran de la page Choisir une stratégie de contrôle d’accès de l’Assistant Ajout d’un groupe d’applications montrant l’option Autoriser tout le monde mise en évidence.

  6. Dans l’écran Configurer les autorisations d’application, vérifiez que openid est sélectionné, puis cliquez sur Suivant.

    Capture d’écran de la page Configurer les autorisations d’application de l’Assistant Ajout d’un groupe d’applications montrant OpenID sélectionné.

  7. Dans l’écran Résumé, cliquez sur Suivant.

  8. Dans la page Terminé, cliquez sur Fermer.

  9. Dans Gestion AD FS, sélectionnez Groupes d’applications, puis le groupe d’applications NativeAppToWebApi. Effectuez un clic droit et sélectionnez Propriétés.

    Capture d’écran de la boîte de dialogue Gestion AD FS montrant le groupe NativeAppToWebApi mis en évidence et l’option Propriétés dans la liste déroulante.

  10. Dans l’écran des propriétés de NativeAppToWebApi, sélectionnez NativeAppToWebApi – API web sous API web, puis cliquez sur Modifier…

    Capture d’écran de la boîte de dialogue Propriétés de NativeAppToWebApi montrant l’application NativeAppToWebApi – API web mise en évidence.

  11. Dans l’écran Propriétés de NativeAppToWebApi – API web, sélectionnez l’onglet Règles de transformation d’émission, puis cliquez sur Ajouter une règle…

    Capture d’écran de la boîte de dialogue Propriétés de NativeAppToWebApi – API web montrant l’onglet Règles de transformation d’émission.

  12. Dans l’Assistant Ajout d’une règle de revendication de transformation, sélectionnez Transformer une revendication entrante dans la liste déroulante Modèle de règle de revendication : et cliquez sur Suivant.

    Capture d’écran de la page Sélectionner un modèle de règle de l’Assistant Ajout d’une règle de revendication de transformation montrant l’option Transformer une revendication entrante sélectionnée.

  13. Entrez NameID dans le champ Nom de la règle de revendication. Sélectionnez Nom pour Type de revendication entrante, ID de nom pour Type de revendication sortante et Nom commun pour Format de l’identificateur du nom sortant. Cliquez sur Terminer.

    Capture d’écran de la page Configurer une règle de l’Assistant Ajout d’une règle de revendication de transformation montrant la configuration expliquée ci-dessus.

  14. Cliquez sur OK dans l’écran Propriétés de NativeAppToWebApi – API web, puis dans l’écran Propriétés de NativeAppToWebApi.

Configuration du code

Cette section montre comment configurer une application native pour connecter un utilisateur et récupérer un jeton pour appeler l’API web.

  1. Téléchargez l’exemple ici.

  2. Ouvrez l’exemple à l’aide de Visual Studio.

  3. Ouvrez le fichier App.config. Modifiez les éléments suivants :

    • ida:Authority : entrez https://[your AD FS hostname]/adfs

    • ida:ClientId : entrez la valeur Identificateur du client issue de l’étape n° 3 de la section Inscription d’application dans AD FS ci-dessus.

    • ida:RedirectUri : entrez la valeur URI de redirection issue de l’étape n° 3 de la section Inscription d’application dans AD FS ci-dessus.

    • todo:TodoListResourceId : entrez la valeur Identificateur issue de l’étape n° 4 de la section Inscription d’application dans AD FS ci-dessus.

    • ida:todo:TodoListBaseAddress : entrez la valeur Identificateur issue de l’étape n° 4 de la section Inscription d’application dans AD FS ci-dessus.

      Capture d’écran du fichier App.config montrant les valeurs modifiées.

  4. Ouvrez le fichier Web.config. Modifiez les éléments suivants :

    • ida:Audience : entrez la valeur Identificateur issue de l’étape n° 4 de la section Inscription d’application dans AD FS ci-dessus.

    • ida:AdfsMetadataEndpoint : entrez https://[your AD FS hostname]/federationmetadata/2007-06/federationmetadata.xml

      Capture d’écran du fichier Web.config montrant les valeurs modifiées.

Tester l’exemple

Cette section montre comment tester l’exemple configuré ci-dessus.

  1. Une fois les modifications apportées au code, regénérez la solution.

  2. Dans Visual Studio, cliquez avec le bouton droit sur la solution et sélectionnez Définir les projets de démarrage…

    Capture d’écran de la liste qui s’affiche quand vous cliquez avec le bouton droit sur la solution avec l’option Définir les projets de démarrage mise en évidence.

  3. Dans les pages Propriétés, vérifiez que l’option Action est définie sur Démarrer pour chacun des projets.

    Capture d’écran de la boîte de dialogue Pages de propriétés de la solution montrant l’option Plusieurs projets de démarrage sélectionnée et toutes les actions des projets définies sur Démarrer.

  4. En haut de Visual Studio, cliquez sur la flèche verte.

    Capture d’écran de l’interface utilisateur de Visual Studio avec l’option Démarrer mise en évidence.

  5. Dans l’écran principal de l’application native, cliquez sur Se connecter.

    Capture d’écran de la boîte de dialogue Client de liste de tâches.

Si vous ne voyez pas l’écran de l’application native, recherchez et supprimez les fichiers *msalcache.bin du dossier où le dépôt du projet est enregistré sur votre système.

  1. Vous allez être redirigé vers la page de connexion AD FS. Connectez-vous.

    Capture d’écran de la page de connexion.

  2. Une fois connecté, entrez le texte Générer une application native sur l’API web dans Créer une tâche. Cliquez sur Ajouter un élément. Cette action appelle le service de liste de tâches (API web) et ajoute l’élément dans le cache.

    Capture d’écran de la boîte de dialogue Client de liste de tâches avec la nouvelle tâche qui remplit la section Liste de tâches.

Étapes suivantes

Flux OpenID Connect/OAuth avec AD FS et scénarios d’application