Activer les options d’authentification dans une application web avec Azure AD B2C

Article
01/11/2024

Cet article décrit les méthodes permettant d’activer, de personnaliser et d’améliorer l’expérience d’authentification Azure Active Directory B2C (Azure AD B2C) pour votre application web.

Avant de commencer, lisez les articles suivants pour vous familiariser avec les concepts :

Utiliser un domaine personnalisé

En utilisant un domaine personnalisé, vous pouvez intégralement marquer l’URL d’authentification. En ce qui concerne les utilisateurs, ils restent sur votre domaine pendant le processus d’authentification, au lieu d’être redirigés vers le nom de domaine Azure AD B2C b2clogin.com.

Pour supprimer toutes les références à « b2c » dans l’URL, vous pouvez remplacer le nom de votre locataire b2c (contoso.onmicrosoft.com) dans l’URL de la requête d’authentification par le GUID d’ID de votre locataire. Par exemple, vous pouvez remplacer https://fabrikamb2c.b2clogin.com/contoso.onmicrosoft.com/ par https://account.contosobank.co.uk/<tenant ID GUID>/.

Pour utiliser un domaine personnalisé et l’ID de votre locataire dans l’URL d’authentification, suivez les instructions fournies dans Activer les domaines personnalisés. Dans le dossier racine du projet, ouvrez le fichier appsettings.json. Ce fichier contient des informations sur votre fournisseur d’identité Azure AD B2C.

Dans le fichier appsettings.json, faites ce qui suit :

Mettez à jour l'entrée Instance avec votre domaine personnalisé.
Mettez à jour l’entrée Domain avec votre ID de locataire. Pour plus d’informations, consultez Utiliser l’ID de locataire.

Le code JSON suivant montre les paramètres de l’application avant la modification :

"AzureAdB2C": {
  "Instance": "https://contoso.b2clogin.com",
  "Domain": "tenant-name.onmicrosoft.com",
  ...
}

Le code JSON suivant montre les paramètres de l’application après la modification :

"AzureAdB2C": {
  "Instance": "https://login.contoso.com",
  "Domain": "00000000-0000-0000-0000-000000000000",
  ...
}

Scénarios avancés d’assistance

La méthode AddMicrosoftIdentityWebAppAuthentication de l’API Microsoft Identity Platform permet aux développeurs d’ajouter du code pour des scénarios d’authentification avancés ou de s’abonner à des événements OpenIdConnect. Par exemple, vous pouvez vous abonner à OnRedirectToIdentityProvider, ce qui vous permet de personnaliser la requête d’authentification que votre application envoie à Azure AD B2C.

Pour prendre en charge les scénarios avancés, ouvrez le fichier Startup.cs et, dans la fonction ConfigureServices, remplacez le AddMicrosoftIdentityWebAppAuthentication par l’extrait de code suivant :

// Configuration to sign-in users with Azure AD B2C

//services.AddMicrosoftIdentityWebAppAuthentication(Configuration, "AzureAdB2C");

services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
        .AddMicrosoftIdentityWebApp(options =>
{
    Configuration.Bind("AzureAdB2C", options);
    options.Events ??= new OpenIdConnectEvents();
    options.Events.OnRedirectToIdentityProvider += OnRedirectToIdentityProviderFunc;
});

Le code précédent ajoute l’événement OnRedirectToIdentityProvider avec une référence à la méthode OnRedirectToIdentityProviderFunc. Ajoutez l’extrait de code suivant dans la classe Startup.cs.

private async Task OnRedirectToIdentityProviderFunc(RedirectContext context)
{
    // Custom code here
    
    // Don't remove this line
    await Task.CompletedTask.ConfigureAwait(false);
}

Vous pouvez transmettre des paramètres entre votre contrôleur et la fonction OnRedirectToIdentityProvider à l’aide de paramètres de contexte.

Pendant le parcours utilisateur pour la connexion, votre application peut cibler un utilisateur spécifique. Quand une application cible un utilisateur, celle-ci peut spécifier, dans la requête d’autorisation, le paramètre de requête login_hint avec le nom de connexion de l’utilisateur. Azure AD B2C remplit automatiquement le nom de connexion, et l’utilisateur n’a que le mot de passe à fournir.

Pour préremplir le nom de connexion, procédez comme suit :

Si vous utilisez une stratégie personnalisée, ajoutez la requête d’entrée requise comme décrit dans Configurer la connexion directe.
Complétez la procédure de prise en charge des scénarios avancés.

Ajoutez la ligne de code suivante à la fonction OnRedirectToIdentityProvider :

private async Task OnRedirectToIdentityProviderFunc(RedirectContext context)
{
  context.ProtocolMessage.LoginHint = "emily@contoso.com";

  // More code
  await Task.CompletedTask.ConfigureAwait(false);
}

Présélectionner un fournisseur d'identité

Si vous avez configuré la procédure de connexion pour votre application afin d’inclure des comptes de réseaux sociaux comme Facebook, LinkedIn ou Google, vous pouvez spécifier le paramètre domain_hint. Ce paramètre de requête fournit un indicateur à Azure AD B2C concernant le fournisseur d’identité sociale qui doit être utilisé pour la connexion. Par exemple, si l’application spécifie domain_hint=facebook.com, le flux de connexion accède directement à la page de connexion Facebook.

Pour rediriger les utilisateurs vers un fournisseur d’identité externe, procédez comme suit :

Vérifiez le nom de domaine de votre fournisseur d’identité externe. Pour plus d’informations, consultez Rediriger la connexion vers un fournisseur social.
Complétez la procédure de prise en charge des scénarios avancés.

Dans la fonction OnRedirectToIdentityProviderFunc, ajoutez la ligne de code suivante à la fonction OnRedirectToIdentityProvider :

private async Task OnRedirectToIdentityProviderFunc(RedirectContext context)
{
  context.ProtocolMessage.DomainHint = "facebook.com";

  // More code
  await Task.CompletedTask.ConfigureAwait(false);
}

Spécifier la langue de l’interface utilisateur

La personnalisation de la langue dans Azure AD B2C permet à votre flux d’utilisateur de prendre en charge plusieurs langues pour répondre aux besoins de votre client. Consultez Personnalisation linguistique pour plus d'informations.

Pour définir la langue par défaut, procédez comme suit :

Configurez la personnalisation de la langue.
Complétez la procédure de prise en charge des scénarios avancés.

Ajoutez la ligne de code suivante à la fonction OnRedirectToIdentityProvider :

private async Task OnRedirectToIdentityProviderFunc(RedirectContext context)
{
  context.ProtocolMessage.UiLocales = "es";

  // More code
  await Task.CompletedTask.ConfigureAwait(false);
}

Passer un paramètre de chaîne de requête personnalisé

Avec les stratégies personnalisées, vous pouvez passer un paramètre de chaîne de requête personnalisé. Les cas où vous souhaitez modifier de façon dynamique le contenu d’une page en sont un bon exemple d’utilisation.

Pour passer un paramètre de chaîne de requête personnalisé, procédez comme suit :

Configurez l’élément ContentDefinitionParameters.
Complétez la procédure de prise en charge des scénarios avancés.

Ajoutez la ligne de code suivante à la fonction OnRedirectToIdentityProvider :

private async Task OnRedirectToIdentityProviderFunc(RedirectContext context)
{
  context.ProtocolMessage.Parameters.Add("campaignId", "123");

  // More code
  await Task.CompletedTask.ConfigureAwait(false);
}

Transmission d’indicateur de jeton d’ID

Une application par partie de confiance peut envoyer un Jeton Web JSON (JWT) entrant dans le cadre de la demande d’autorisation OAuth2. Le jeton entrant est une indication de l’utilisateur ou de la demande d’autorisation. Azure AD B2C valide le jeton puis extrait la demande.

Pour inclure un indicateur de jeton d’ID dans la requête d’authentification, procédez comme suit :

Complétez la procédure de prise en charge des scénarios avancés.
Dans votre stratégie personnalisée, définissez un indicateur de jeton d’ID de profil technique.

Ajoutez la ligne de code suivante à la fonction OnRedirectToIdentityProvider :

private async Task OnRedirectToIdentityProviderFunc(RedirectContext context)
{
  // The idTokenHint variable holds your ID token 
  context.ProtocolMessage.IdTokenHint = idTokenHint

  // More code
  await Task.CompletedTask.ConfigureAwait(false);
}

Contrôleur de compte

Si vous souhaitez personnaliser les actions de connexion, d’inscription ou de déconnexion, nous vous encourageons à créer votre propre contrôleur. Le fait de disposer de votre propre contrôleur vous permet de transmettre des paramètres entre votre contrôleur et la bibliothèque d’authentification. Le AccountController fait partie du package NuGet Microsoft.Identity.Web.UI, qui gère les actions de connexion et de déconnexion. Vous pouvez trouver son implémentation dans la bibliothèque Microsoft Identity Web.

Ajouter le contrôleur de compte

Dans le projet Visual Studio, cliquez avec le bouton droit sur le dossier Contrôleurs et ajoutez un nouveau Contrôleur. Sélectionnez MVC - Contrôleur vide, puis fournissez le nom MyAccountController.cs.

L’extrait de code suivant montre un MyAccountController personnalisé avec l’action de SignIn.

using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Authentication;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;


namespace mywebapp.Controllers
{
    [AllowAnonymous]
    [Area("MicrosoftIdentity")]
    [Route("[area]/[controller]/[action]")]
    public class MyAccountController : Controller
    {

        [HttpGet("{scheme?}")]
        public IActionResult SignIn([FromRoute] string scheme)
        {
            scheme ??= OpenIdConnectDefaults.AuthenticationScheme;
            var redirectUrl = Url.Content("~/");
            var properties = new AuthenticationProperties { RedirectUri = redirectUrl };
            return Challenge(properties, scheme);
        }

    }
}

Dans l’affichage _LoginPartial.cshtml, modifiez le lien de connexion à votre contrôleur.

<form method="get" asp-area="MicrosoftIdentity" asp-controller="MyAccount" asp-action="SignIn">

Transmettre l’ID de stratégie Azure AD B2C

L’extrait de code suivant montre un MyAccountController personnalisé avec les actions SignIn et SignUp. L’action transmet un paramètre nommé policy à la bibliothèque d’authentification. Cela vous permet de fournir l’ID de stratégie Azure AD B2C qui convient pour l’action spécifique.

public IActionResult SignIn([FromRoute] string scheme)
{
    scheme ??= OpenIdConnectDefaults.AuthenticationScheme;
    var redirectUrl = Url.Content("~/");
    var properties = new AuthenticationProperties { RedirectUri = redirectUrl };
    properties.Items["policy"] = "B2C_1_SignIn";
    return Challenge(properties, scheme);
}

public IActionResult SignUp([FromRoute] string scheme)
{
    scheme ??= OpenIdConnectDefaults.AuthenticationScheme;
    var redirectUrl = Url.Content("~/");
    var properties = new AuthenticationProperties { RedirectUri = redirectUrl };
    properties.Items["policy"] = "B2C_1_SignUp";
    return Challenge(properties, scheme);
}

Dans l’affichage _LoginPartial.cshtml, remplacez la valeur asp-controller par MyAccountController pour tous les autres liens d’authentification, tels que l’inscription ou la modification du profil.

Transmettre les paramètres personnalisés

L’extrait de code suivant montre un MyAccountController personnalisé avec l’action de SignIn. L’action transmet un paramètre nommé campaign_id à la bibliothèque d’authentification.

public IActionResult SignIn([FromRoute] string scheme)
{
    scheme ??= OpenIdConnectDefaults.AuthenticationScheme;
    var redirectUrl = Url.Content("~/");
    var properties = new AuthenticationProperties { RedirectUri = redirectUrl };
    properties.Items["policy"] = "B2C_1_SignIn";
    properties.Items["campaign_id"] = "1234";
    return Challenge(properties, scheme);
}

Complétez la procédure de prise en charge des scénarios avancés, puis, dans la méthode OnRedirectToIdentityProvider, lisez le paramètre personnalisé :

private async Task OnRedirectToIdentityProviderFunc(RedirectContext context)
{
    // Read the custom parameter
    var campaign_id = context.Properties.Items.FirstOrDefault(x => x.Key == "campaign_id").Value;

    // Add your custom code here
    if (campaign_id != null)
    {
        // Send parameter to authentication request
        context.ProtocolMessage.SetParameter("campaign_id", campaign_id);
    }
    
    await Task.CompletedTask.ConfigureAwait(false);
}

Sécuriser la redirection de déconnexion

Après la déconnexion, l’utilisateur est redirigé vers l’URI spécifié dans le paramètre post_logout_redirect_uri, quelles que soient les URL de réponse qui ont été spécifiées pour l’application. Cependant, si un id_token_hint valide est transmis et que l’option Exiger un jeton d’ID dans les demandes de déconnexion est activée, Azure AD B2C vérifie que la valeur de post_logout_redirect_uri correspond à l’un des URI de redirection configurés de l’application avant d’effectuer la redirection. Si aucune URL de réponse correspondante n’a été configurée pour l’application, un message d’erreur s’affiche et l’utilisateur n’est pas redirigé.

Pour prendre en charge une redirection de déconnexion sécurisée dans votre application, suivez d’abord les étapes décrites dans les sections Contrôleur de compte et Prendre en charge les scénarios avancés. Suivez ensuite les étapes ci-dessous :

Dans le contrôleur MyAccountController.cs, ajoutez une action SignOut à l’aide de l’extrait de code suivant :

[HttpGet("{scheme?}")]
public async Task<IActionResult> SignOutAsync([FromRoute] string scheme)
{
    scheme ??= OpenIdConnectDefaults.AuthenticationScheme;

    //obtain the id_token
    var idToken = await HttpContext.GetTokenAsync("id_token");
    //send the id_token value to the authentication middleware
    properties.Items["id_token_hint"] = idToken;            

    return SignOut(properties,CookieAuthenticationDefaults.AuthenticationScheme,scheme);
}

Dans la classe Startup.cs, analysez la valeur id_token_hint et ajoutez la valeur à la demande d’authentification. L’extrait de code suivant montre comment transmettre la valeur id_token_hint à la demande d’authentification :

private async Task OnRedirectToIdentityProviderForSignOutFunc(RedirectContext context)
{
    var id_token_hint = context.Properties.Items.FirstOrDefault(x => x.Key == "id_token_hint").Value;
    if (id_token_hint != null)
    {
        // Send parameter to authentication request
        context.ProtocolMessage.SetParameter("id_token_hint", id_token_hint);
    }

    await Task.CompletedTask.ConfigureAwait(false);
}

Dans la fonction ConfigureServices, ajoutez l’option SaveTokens pour permettre aux contrôleurs d’accéder à la valeur id_token :

services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
    .AddMicrosoftIdentityWebApp(options =>
    {
        Configuration.Bind("AzureAdB2C", options);
        options.Events ??= new OpenIdConnectEvents();        
        options.Events.OnRedirectToIdentityProviderForSignOut += OnRedirectToIdentityProviderForSignOutFunc;
        options.SaveTokens = true;
    });

Dans le fichier de configuration appsettings.json, ajoutez le chemin d’accès de l’URI de redirection de déconnexion à la clé SignedOutCallbackPath.

"AzureAdB2C": {
  "Instance": "https://<your-tenant-name>.b2clogin.com",
  "ClientId": "<web-app-application-id>",
  "Domain": "<your-b2c-domain>",
  "SignedOutCallbackPath": "/signout/<your-sign-up-in-policy>",
  "SignUpSignInPolicyId": "<your-sign-up-in-policy>"
}

Dans l’exemple ci-dessus, le post_logout_redirect_uri qui est passé dans la demande de déconnexion sera au format https://your-app.com/signout/<your-sign-up-in-policy>. Cette URL doit être ajoutée à l’URL de réponse de l’inscription d’application.

Contrôle d'accès en fonction d'un rôle

Avec l'autorisation dans ASP.NET Core, vous pouvez vérifier si les utilisateurs sont autorisés à accéder à une ressource protégée à l’aide de l’une des méthodes suivantes :

Dans la méthode ConfigureServices, ajoutez la méthode AddAuthorization, qui ajoute le modèle d’autorisation. L’exemple qui suit permet de créer une clé nommée EmployeeOnly. La stratégie vérifie qu'il existe une revendication EmployeeNumber. La valeur de la revendication doit être l’un des ID suivants : 1, 2, 3, 4 ou 5.

services.AddAuthorization(options =>
    {
        options.AddPolicy("EmployeeOnly", policy =>
              policy.RequireClaim("EmployeeNumber", "1", "2", "3", "4", "5"));
    });

Vous contrôlez l’autorisation dans ASP.NET Core à l’aide de AuthorizeAttribute et de ses différents paramètres. Dans sa forme la plus basique, l’application de l’attribut Authorize à une page de contrôleur, d’action ou Razor, limite l’accès aux utilisateurs authentifiés de ce composant.

Les stratégies sont appliquées aux contrôleurs à l’aide de l'attribut Authorize avec le nom de la stratégie. Le code suivant limite l’accès à l’action Claims aux utilisateurs autorisés par la stratégie EmployeeOnly :

[Authorize(Policy = "EmployeeOnly")]
public IActionResult Claims()
{
    return View();
}

Étapes suivantes

Pour en savoir plus sur l’autorisation, consultez Présentation de l’autorisation dans ASP.NET Core.

Partager via

Activer les options d’authentification dans une application web avec Azure AD B2C

Utiliser un domaine personnalisé

Scénarios avancés d’assistance

Présélectionner un fournisseur d'identité

Spécifier la langue de l’interface utilisateur

Passer un paramètre de chaîne de requête personnalisé

Transmission d’indicateur de jeton d’ID

Contrôleur de compte

Ajouter le contrôleur de compte

Transmettre l’ID de stratégie Azure AD B2C

Transmettre les paramètres personnalisés

Sécuriser la redirection de déconnexion

Contrôle d'accès en fonction d'un rôle

Étapes suivantes

Ressources supplémentaires

Partager via

Activer les options d’authentification dans une application web avec Azure AD B2C

Utiliser un domaine personnalisé

Scénarios avancés d’assistance

Préremplir le nom de connexion

Présélectionner un fournisseur d'identité

Spécifier la langue de l’interface utilisateur

Passer un paramètre de chaîne de requête personnalisé

Transmission d’indicateur de jeton d’ID

Contrôleur de compte

Ajouter le contrôleur de compte

Transmettre l’ID de stratégie Azure AD B2C

Transmettre les paramètres personnalisés

Sécuriser la redirection de déconnexion

Contrôle d'accès en fonction d'un rôle

Étapes suivantes

Ressources supplémentaires