Guida introduttiva: Effettuare l'accesso degli utenti in un'app Web ASP.NET Core

In questa guida introduttiva, si crea un'app Web ASP.NET Core che consente il login degli utenti con Microsoft Entra ID usando Microsoft.Identity.Web. È possibile eseguire lo scaffolding di un nuovo progetto da un modello o aggiungere l'autenticazione a un'app esistente.

Se non si ha un tenant Microsoft Entra, creare un account free prima di iniziare.

Prerequisiti

• .NET 9 SDK
• Un tenant Microsoft Entra ID
• Registrazione dell'app nel tenant Microsoft Entra. Se è necessario crearne uno, vedere Registrare l'applicazione.

Creare un progetto dal modello

Il modo più rapido per iniziare consiste nello scaffolding di un nuovo progetto con l'autenticazione preconfigurata.

Eseguire i comandi seguenti per creare una nuova app Web con l'autenticazione a singola organizzazione e passare alla directory del progetto:

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

Il modello genera un progetto con Microsoft. Identity.Web già configurato. Devi specificare solo i dettagli di registrazione dell'app.

Aprire appsettings.json e sostituire i valori segnaposto con l'ID applicazione (client) e l'ID directory (tenant) dalla registrazione dell'app:

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

Avviare l'applicazione per verificare che l'accesso funzioni:

dotnet run

Passare a https://localhost:5001 e selezionare Accedi. Se viene visualizzata una richiesta di accesso Microsoft, la configurazione è corretta.

Aggiungere l'autenticazione a un'app Web esistente

Se si dispone di un'app ASP.NET Core esistente, seguire questa procedura per aggiungere l'accesso a Microsoft Entra.

Installare i pacchetti NuGet

Aggiungere le librerie Microsoft.Identity.Web. Il pacchetto Microsoft.Identity.Web gestisce l'autenticazione e Microsoft.Identity.Web.UI fornisce componenti predefiniti dell'interfaccia utente per l'accesso e la disconnessione.

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

Configurare i servizi di autenticazione

Aprire Program.cs e aggiungere i servizi di autenticazione. Il codice seguente registra l'autenticazione OpenID Connect con Microsoft Entra, abilita l'acquisizione di token per le chiamate API downstream e aggiunge l'interfaccia utente di accesso/disconnesso:

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();

Aggiungere la configurazione di Microsoft Entra

Aprire appsettings.json e aggiungere la AzureAd sezione . Sostituisci i valori segnaposto con l'ID applicazione (client) della registrazione dell'applicazione. Impostare TenantId sul gruppo di destinatari appropriato per l'app:

{
  "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"
    }
  }
}

Il TenantId valore determina quali account possono accedere:

Proteggere le pagine

Aggiungere l'attributo [Authorize] alle pagine o ai controller che richiedono l'accesso.

Per Razor Pages, l'attributo [Authorize] reindirizza gli utenti non autenticati alla pagina di accesso. Dopo l'accesso, le attestazioni utente come Name e preferred_username sono disponibili tramite l'oggetto 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;
    }
}

Per i controller MVC, lo stesso [Authorize] attributo si applica a livello di controller o azione:

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();
    }
}

Aggiungere collegamenti per l'accesso e la disconnessione

Aggiungere collegamenti di navigazione al layout in modo che gli utenti possano effettuare il login e il logout. Le route dell'area MicrosoftIdentity vengono fornite dal pacchetto Microsoft.Identity.Web.UI. Il seguente markup Razor esegue condizionalmente il rendering di Disconnetti oppure di Accedi, in base allo stato di autenticazione dell'utente:

<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>

Esecuzione e test

Avviare l'applicazione per verificare che l'autenticazione funzioni:

dotnet run

Navigare verso https://localhost:5001. Verrà visualizzato un collegamento Accedi . Seleziona per confermare che il flusso di accesso a Microsoft venga completato correttamente.

Registra la tua applicazione

Se non si ha già una registrazione dell'app, seguire questa procedura per crearne una nel portale di Azure.

1. Accedi al portale di Azure.
2. Passare a Microsoft Entra ID>Registrazioni app>Nuova registrazione.
3. Immettere un nome visualizzato, ad esempio "App Web personale".
4. Selezionare i tipi di account supportati:
   • Tenant singolo : solo gli utenti dell'organizzazione
   • Multi-tenant : utenti di qualsiasi organizzazione
   • Multi-tenant + personal - Tutti gli account Microsoft
5. In URI di reindirizzamento impostare la piattaforma su Web e immettere https://localhost:5001/signin-oidc.
6. Selezionare Registrazione.
7. Nella pagina di panoramica copiare l'ID applicazione (client) e l'ID directory (tenant). Questi valori sono necessari per i ClientId campi e TenantId in appsettings.json.

Configurare impostazioni facoltative

Lo scenario potrebbe richiedere queste impostazioni aggiuntive.

Abilitare il rilascio di token ID : alcuni scenari di autenticazione ibrida richiedono l'emissione di token ID direttamente dall'endpoint di autorizzazione. Il flusso del codice di autorizzazione (usato da Microsoft.Identity.Web) è l'approccio consigliato. Abilitare questa impostazione solo se lo scenario richiede in modo specifico:

1. Nella registrazione dell'app passare a Autenticazione.
2. In Concessione implicita e flussi ibridi selezionare Token ID.
3. Seleziona Salva.

Configurare l'URL di disconnessione del canale front-channel : assicura che gli utenti siano disconnessi dall'app quando escono da Microsoft Entra:

1. Nella registrazione dell'app passare a Autenticazione.
2. In URL di disconnessione front-channel, immettere https://localhost:5001/signout-oidc.
3. Seleziona Salva.

Risolvere gli errori comuni

Se si verificano problemi durante l'accesso, verificare la presenza di questi errori comuni.

Contenuti correlati

• Chiamata di API downstream dalle app Web
• Autorizzazione
• Panoramica della cache dei token
• Guida introduttiva: API Web