Démarrage rapide : Connecter des utilisateurs dans une application web ASP.NET Core

Dans ce guide de démarrage rapide, vous créez une application web ASP.NET Core qui connecte des utilisateurs avec Microsoft Entra ID à l’aide de Microsoft. Identity.Web. Vous pouvez générer une structure d’un nouveau projet à partir d’un modèle ou ajouter l’authentification à une application existante.

Si vous n'avez pas de client Microsoft Entra, créez un compte gratuit avant de commencer.

Prerequisites

• SDK .NET 9
• Un locataire Microsoft Entra ID
• Enregistrement d'application dans votre locataire Microsoft Entra. Si vous devez en créer un, consultez Inscrire votre application.

Créer un projet à partir du modèle

Le moyen le plus rapide de commencer consiste à générer une structure d’un nouveau projet avec l’authentification préconfigurée.

Exécutez les commandes suivantes pour créer une application web avec l’authentification à organisation unique et accédez au répertoire du projet :

dotnet new webapp --auth SingleOrg --name MyWebApp
cd MyWebApp

Le modèle génère un projet avec Microsoft. Identity.Web déjà configuré. Vous devez uniquement fournir les détails de l’inscription de votre application.

Ouvrez appsettings.json et remplacez les valeurs des espaces réservés par l’ID d’application (client) et l’ID d'annuaire (locataire) de l'enregistrement de votre application :

{
  "AzureAd": {
    "Instance": "https://login.microsoftonline.com/",
    "TenantId": "your-tenant-id",
    "ClientId": "your-client-id",
    "CallbackPath": "/signin-oidc"
  }
}

Démarrez l’application pour vérifier que la connexion fonctionne :

dotnet run

Accédez à https://localhost:5001 et sélectionnez Se connecter. Si une invite de connexion Microsoft s’affiche, la configuration est correcte.

Ajouter l’authentification à une application web existante

Si vous disposez d’une application ASP.NET Core existante, procédez comme suit pour ajouter Microsoft Entra connexion.

Installer les packages NuGet

Ajoutez la bibliothèque Microsoft.Identity.Web. Le package Microsoft.Identity.Web gère l’authentification et Microsoft.Identity.Web.UI fournit des composants d’interface utilisateur prédéfinis de connexion et de déconnexion :

dotnet add package Microsoft.Identity.Web
dotnet add package Microsoft.Identity.Web.UI

Configurer les services d’authentification

Ouvrez Program.cs et ajoutez les services d’authentification. Le code suivant enregistre l'authentification OpenID Connect avec Microsoft Entra, active l’acquisition de jetons pour les appels d’API en aval et ajoute l'interface de connexion/déconnexion :

using Microsoft.Identity.Web;
using Microsoft.Identity.Web.UI;

var builder = WebApplication.CreateBuilder(args);

// Add authentication
builder.Services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
                .AddMicrosoftIdentityWebApp(builder.Configuration, "AzureAd")
                .EnableTokenAcquisitionToCallDownstreamApi() // Optional: if calling APIs
                .AddInMemoryTokenCaches(); // For production, use distributed cache

// Add Razor Pages or MVC
builder.Services.AddRazorPages()
    .AddMicrosoftIdentityUI(); // Adds sign-in/sign-out UI

var app = builder.Build();

// Configure middleware
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    app.UseHsts();
}

app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseRouting();

app.UseAuthentication(); //  Add authentication middleware
app.UseAuthorization();

app.MapRazorPages();
app.MapControllers();

app.Run();

Ajouter une configuration Microsoft Entra

Ouvrez appsettings.json et ajoutez la AzureAd section. Remplacez les valeurs d’espace réservé par l’ID d’application (client) de votre application. Définissez TenantId l’audience appropriée pour votre application :

{
  "AzureAd": {
    "Instance": "https://login.microsoftonline.com/",
    "TenantId": "common",
    "ClientId": "your-client-id-from-app-registration",
    "CallbackPath": "/signin-oidc"
  },
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft.Identity.Web": "Information"
    }
  }
}

La TenantId valeur détermine quels comptes peuvent se connecter :

Protéger vos pages

Ajoutez l’attribut [Authorize] aux pages ou aux contrôleurs qui nécessitent la connexion.

Pour Razor Pages, l’attribut [Authorize] redirige les utilisateurs non authentifiés vers la page de connexion. Après la connexion, les revendications utilisateur comme Name et preferred_username sont disponibles via l’objet User :

using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc.RazorPages;

[Authorize] //  Require authentication
public class IndexModel : PageModel
{
    public void OnGet()
    {
        var userName = User.Identity?.Name;
        var userEmail = User.FindFirst("preferred_username")?.Value;
    }
}

Pour les contrôleurs MVC, le même [Authorize] attribut s’applique au niveau du contrôleur ou de l’action :

using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;

[Authorize] //  Require authentication
public class HomeController : Controller
{
    public IActionResult Index()
    {
        var userName = User.Identity?.Name;
        return View();
    }
}

Ajouter des liens de connexion et de déconnexion

Ajoutez des liens de navigation à votre disposition afin que les utilisateurs puissent se connecter et se déconnecter. Les itinéraires de zone MicrosoftIdentity sont fournis par le package Microsoft.Identity.Web.UI. Le balisage Razor suivant rend conditionnellement Se déconnecter ou Se connecter en fonction de l’état d’authentification de l’utilisateur :

<ul class="navbar-nav">
    @if (User.Identity?.IsAuthenticated == true)
    {
        <li class="nav-item">
            <span class="nav-link">Hello @User.Identity.Name!</span>
        </li>
        <li class="nav-item">
            <a class="nav-link" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignOut">Sign out</a>
        </li>
    }
    else
    {
        <li class="nav-item">
            <a class="nav-link" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignIn">Sign in</a>
        </li>
    }
</ul>

Exécuter et tester

Démarrez l’application pour vérifier que l’authentification fonctionne :

dotnet run

Accédez à https://localhost:5001. Vous devriez voir un lien Se connecter. Sélectionnez-la pour confirmer que le flux de connexion Microsoft se termine correctement.

Enregistrer votre application

Si vous n'avez pas encore d'inscription d'application, procédez comme suit pour en créer un dans le portail Azure.

1. Connectez-vous au portail Azure.
2. Accédez à Microsoft Entra ID>enregistrements d’application>Nouvel enregistrement.
3. Entrez un nom d'affichage (par exemple, « Mon application web »).
4. Sélectionnez les types de comptes pris en charge :
   • Client unique : utilisateurs de votre organisation uniquement
   • Multilocataire : utilisateurs de n’importe quelle organisation
   • Multi-tenant + personal — Tous les comptes Microsoft
5. Sous URI de redirection, définissez la plateforme sur Web et entrez https://localhost:5001/signin-oidc.
6. Sélectionnez Enregistrer.
7. Dans la page d’aperçu, copiez l'ID d'application (client) et l'ID d'annuaire (locataire). Vous avez besoin de ces valeurs pour les champs ClientId et TenantId dans appsettings.json.

Configurer les paramètres facultatifs

Votre scénario peut nécessiter ces paramètres supplémentaires.

Activer l’émission de jetons d’ID : certains scénarios d’authentification hybride nécessitent l’émission de jetons d’ID directement à partir du point de terminaison d’autorisation. Flux de code d’autorisation (utilisé par Microsoft. Identity.Web) est l’approche recommandée. Activez ce paramètre uniquement si votre scénario le nécessite spécifiquement :

1. Dans l’inscription de votre application, accédez à l’authentification.
2. Sous Octroi implicite et flux hybrides, sélectionnez Jetons d’ID.
3. Cliquez sur Enregistrer.

Configurer l'URL de déconnexion du canal frontal pour garantir que les utilisateurs soient déconnectés de votre application lorsqu’ils se déconnectent de Microsoft Entra :

1. Dans l’inscription de votre application, accédez à l’authentification.
2. Sous l’URL de déconnexion du canal frontal, entrez https://localhost:5001/signout-oidc.
3. Cliquez sur Enregistrer.

Résoudre les erreurs courantes

Si vous rencontrez des problèmes lors de la connexion, recherchez ces erreurs courantes.

Contenu connexe

• Appel d’API en aval à partir d’applications web
• Autorisation
• Vue d’ensemble du cache de jetons
• Démarrage rapide : API web