Partager via


Démarrage rapide : Configurer la connexion pour une application ASP.NET à l’aide d’Azure Active Directory B2C

Important

À compter du 1er mai 2025, Azure AD B2C ne sera plus disponible pour les nouveaux clients. Pour plus d’informations, consultez notre FAQ.

Azure Active Directory B2C (Azure AD B2C) fournit la gestion des identités cloud pour protéger votre application, votre entreprise et vos clients. Azure AD B2C permet à vos applications de s’authentifier auprès de comptes sociaux et de comptes d’entreprise à l’aide de protocoles standard ouverts.

Dans ce guide de démarrage rapide, vous utilisez une application ASP.NET pour vous connecter à l’aide d’un fournisseur d’identité sociale et appeler une API web protégée par Azure AD B2C.

Conditions préalables

  • Visual Studio 2022 avec la charge de travail Développement web et ASP.NET.

  • Un compte social de Facebook, Google ou Microsoft.

  • Téléchargez un fichier zip ou clonez l’exemple d’application web à partir de GitHub.

    git clone https://github.com/Azure-Samples/active-directory-b2c-dotnet-webapp-and-webapi.git
    

    Il existe deux projets dans l’exemple de solution :

    • TaskWebApp : application web qui crée et modifie une liste de tâches. L’application web utilise le flux d’utilisateur d’inscription ou de connexion pour inscrire ou connecter des utilisateurs.
    • TaskService : API web qui prend en charge la fonctionnalité de création, de lecture, de mise à jour et de suppression de la liste des tâches. L’API web est protégée par Azure AD B2C et appelée par l’application web.

Exécuter l’application dans Visual Studio

  1. Dans l’exemple de dossier de projet d’application, ouvrez la solution B2C-WebAPI-DotNet.sln dans Visual Studio.

  2. Pour ce guide de démarrage rapide, vous exécutez simultanément les projets TaskWebApp et TaskService . Cliquez avec le bouton droit sur la solution B2C-WebAPI-DotNet dans l’Explorateur de solutions, puis sélectionnez Configurer les projets de démarrage....

  3. Sélectionnez Projets de démarrage multiples et modifiez l'action pour les deux projets en Démarrer.

  4. Cliquez sur OK.

  5. Appuyez sur F5 pour déboguer les deux applications. Chaque application s’ouvre dans son propre onglet de navigateur :

    • https://localhost:44316/ : application web ASP.NET. Vous interagissez directement avec cette application dans le guide de démarrage rapide.
    • https://localhost:44332/ - API web appelée par l’application web ASP.NET.

Se connecter à l’aide de votre compte

  1. Sélectionnez S’inscrire / Se connecter à l’application web ASP.NET pour démarrer le flux de travail.

    Capture d’écran montrant l’exemple d’application web ASP.NET dans le navigateur avec le lien d’inscription/de connexion mis en surbrillance

    L’exemple prend en charge plusieurs options d’inscription, notamment l’utilisation d’un fournisseur d’identité sociale ou la création d’un compte local à l’aide d’une adresse e-mail. Pour ce guide de démarrage rapide, utilisez un compte de fournisseur d’identité sociale de Facebook, Google ou Microsoft.

  2. Azure AD B2C présente une page de connexion pour une société fictive appelée Fabrikam pour l’exemple d’application web. Pour vous inscrire à l’aide d’un fournisseur d’identité sociale, sélectionnez le bouton du fournisseur d’identité que vous souhaitez utiliser.

    Capture d’écran des boutons du fournisseur d’identité de la page de connexion ou d'inscription

    Vous authentifiez (connectez-vous) à l’aide de vos informations d’identification de compte social et autorisez l’application à lire les informations de votre compte social. En accordant l’accès, l’application peut récupérer des informations de profil à partir du compte social, telles que votre nom et votre ville.

  3. Terminez le processus de connexion pour le fournisseur d’identité.

Modifier votre profil

Azure Active Directory B2C fournit des fonctionnalités permettant aux utilisateurs de mettre à jour leurs profils. L’exemple d’application web utilise un flux utilisateur de profil de modification Azure AD B2C pour le flux de travail.

  1. Dans la barre de menus de l’application, sélectionnez votre nom de profil, puis modifiez le profil pour modifier le profil que vous avez créé.

    Capture d’écran de l’exemple d’application web dans le navigateur avec le lien modifier le profil mis en surbrillance

  2. Modifiez votre nom d’affichage ou ville, puis sélectionnez Continuer à mettre à jour votre profil.

    La modification s’affiche dans la partie supérieure droite de la page d’accueil de l’application web.

Accéder à une ressource d’API protégée

  1. Sélectionnez To-Do liste pour saisir et modifier les éléments de votre liste to-do.

  2. Dans la zone de texte Nouvel élément , entrez le texte. Pour appeler l’API web protégée par Azure AD B2C qui ajoute un élément de liste to-do, sélectionnez Ajouter.

    Capture d’écran de l’exemple d’application web dans le navigateur avec le lien To-Do Liste et le bouton Ajouter mis en surbrillance.

    L’application web ASP.NET inclut un jeton d’accès Microsoft Entra dans la demande adressée à la ressource d’API web protégée pour effectuer des opérations sur les éléments de la liste to-do de l’utilisateur.

Vous avez correctement utilisé votre compte d’utilisateur Azure AD B2C pour effectuer un appel autorisé à une API web protégée par Azure AD B2C.

Étapes suivantes

Créer un locataire Azure Active Directory B2C dans le portail Azure