Autenticazione cloud con Azure Active Directory B2C in ASP.NET Core

Articolo
11/30/2023

Azure Active Directory B2C (Azure AD B2C) è una soluzione di gestione delle identità cloud per le app Web e per dispositivi mobili. Il servizio fornisce l'autenticazione per le app ospitate nel cloud e in locale. I tipi di autenticazione includono account singoli, account di social network e account aziendali federati. Inoltre, Azure AD B2C può fornire l'autenticazione a più fattori con una configurazione minima.

Suggerimento

Microsoft Entra ID, Microsoft Entra per ID esterno e Azure AD B2C sono offerte di prodotti separati. Un tenant Entra ID rappresenta in genere un'organizzazione, mentre un tenant di Azure AD B2C o un tenant Microsoft Entra per ID esterno può rappresentare una raccolta di identità da usare con applicazioni relying party. Per altre informazioni, vedere Azure AD B2C: Domande frequenti.

Suggerimento

Microsoft Entra per ID esterno per i clienti è la nuova soluzione ciAM (Customer Identity and Access Management) di Microsoft.

Questa esercitazione descrive come configurare un'app ASP.NET Core per l'autenticazione con Azure AD B2C.

Prerequisiti

Un account Azure con una sottoscrizione attiva. Creare un account gratuitamente.
.NET SDK. Installare la versione più recente di .NET SDK per la piattaforma.

Preparazione

Creare un tenant di Azure Active Directory B2C.
Creare una nuova app ASP.NET Pagine principali Razor :
```
dotnet new razor -o azure-ad-b2c
```
Il comando precedente crea un'app Razor pages in una directory denominata azure-ad-b2c.

Suggerimento

È consigliabile usare Visual Studio per creare l'app.
Creare una registrazione dell'app Web nel tenant. Per URI di reindirizzamento, usare https://localhost:5001/signin-oidc. Sostituire 5001 con la porta usata dall'app quando si usano le porte generate da Visual Studio.

Modificare l'app

Aggiungere i pacchetti Microsoft.Identity.Web e Microsoft.Identity.Web.UI al progetto. Se si usa Visual Studio, è possibile usare nuGet Gestione pacchetti.
```
dotnet add package Microsoft.Identity.Web
dotnet add package Microsoft.Identity.Web.UI
```
Nell'esempio precedente:
- Microsoft.Identity.Web include il set di base di dipendenze per l'autenticazione con la piattaforma Microsoft Identity .
- Microsoft.Identity.Web.UI include funzionalità dell'interfaccia utente incapsulate in un'area denominata MicrosoftIdentity.

Aggiungere un AzureADB2C oggetto a appsettings.json.

Nota

Quando si usano i flussi utente di Azure B2C, è necessario impostare Instance e PolicyId del tipo di flusso.

{
  "AzureADB2C": {
    "Instance": "https://--your-domain--.b2clogin.com",
    "Domain": "[Enter the domain of your B2C tenant, e.g. contoso.onmicrosoft.com]",
    "TenantId": "[Enter 'common', or 'organizations' or the Tenant Id (Obtained from the Azure portal. Select 'Endpoints' from the 'App registrations' blade and use the GUID in any of the URLs), e.g. da41245a5-11b3-996c-00a8-4d99re19f292]",
    "ClientId": "[Enter the Client Id (Application ID obtained from the Azure portal), e.g. ba74781c2-53c2-442a-97c2-3d60re42f403]",
    // Use either a secret or a certificate. ClientCertificates are recommended.
    "ClientSecret": "[Copy the client secret added to the app from the Azure portal]",
    "ClientCertificates": [
    ],
    // the following is required to handle Continuous Access Evaluation challenges
    "ClientCapabilities": [ "cp1" ],
    "CallbackPath": "/signin-oidc",
    // Add your policy here
    "SignUpSignInPolicyId": "B2C_1_signup_signin",
    "SignedOutCallbackPath": "/signout-callback-oidc"
  },
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft": "Warning",
      "Microsoft.Hosting.Lifetime": "Information"
    }
  },
  "AllowedHosts": "*"
}

Per Dominio usare il dominio del tenant di Azure AD B2C.
Per ClientId usare l'ID applicazione (client) dalla registrazione dell'app creata nel tenant.
Ad esempio, usare il dominio del tenant di Azure AD B2C.
Per SignUpSignInPolicyId, usare i criteri del flusso utente definiti nel tenant di Azure B2C
Usare la configurazione ClientSecret o ClientCertificates . I certificati client sono consigliati.
Lascia tutti gli altri valori così come sono.

In Pages/Shared creare un file denominato _LoginPartial.cshtml. Includere il codice seguente:

@using System.Security.Principal

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

Il codice precedente:

Controlla se l'utente è autenticato.
Esegue il rendering di un collegamento Disconnetti o Accedi in base alle esigenze.
- Il collegamento punta a un metodo di azione sul Account controller nell'area MicrosoftIdentity .

In Pages/Shared/_Layout.cshtml aggiungere la riga evidenziata all'interno dell'elemento <header> :

<header>
    <nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
        <div class="container">
            <a class="navbar-brand" asp-area="" asp-page="/Index">azure_ad_b2c</a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target=".navbar-collapse" aria-controls="navbarSupportedContent"
                    aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="navbar-collapse collapse d-sm-inline-flex justify-content-between">
                <ul class="navbar-nav flex-grow-1">
                    <li class="nav-item">
                        <a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a>
                    </li>
                </ul>
                <partial name="_LoginPartial" />
            </div>
        </div>
    </nav>
</header>

L'aggiunta <partial name="_LoginPartial" /> esegue il rendering della _LoginPartial.cshtml visualizzazione parziale in ogni richiesta di pagina che usa questo layout.

In Program.cs apportare le modifiche seguenti:
1. Aggiungere le direttive using seguenti:
```
using Microsoft.Identity.Web;
using Microsoft.Identity.Web.UI;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;
```
  Il codice precedente risolve i riferimenti usati nei passaggi successivi.
2. Aggiornare le builder.Services righe con il codice seguente:
```
builder.Services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
        .AddMicrosoftIdentityWebApp(builder.Configuration.GetSection("AzureADB2C"));

builder.Services.AddAuthorization(options =>
{
    // By default, all incoming requests will be authorized according to 
    // the default policy
    options.FallbackPolicy = options.DefaultPolicy;
});
builder.Services.AddRazorPages(options => {
    options.Conventions.AllowAnonymousToPage("/Index");
})
.AddMvcOptions(options => { })
.AddMicrosoftIdentityUI();
```
  Nel codice precedente:
  - Le chiamate ai AddAuthentication metodi e AddMicrosoftIdentityWebApp configurano l'app per l'uso di Open ID Connessione, configurate in modo specifico per la piattaforma MicrosoftIdentity.
  - AddAuthorization inizializza ASP.NET'autorizzazione Core.
  - La AddRazorPages chiamata configura l'app in modo che i browser anonimi possano visualizzare la pagina Indice. Tutte le altre richieste richiedono l'autenticazione.
  - AddMvcOptions e AddMicrosoftIdentityUI aggiungere i componenti dell'interfaccia utente necessari per il reindirizzamento da e verso Azure AD B2C.
3. Aggiornare la riga evidenziata al Configure metodo :
```
app.UseRouting();

app.UseAuthentication();
app.UseAuthorization();

app.MapRazorPages();
```
  Il codice precedente abilita l'autenticazione in ASP.NET Core.

Eseguire l'app

Nota

Usare il profilo che corrisponde agli URI di reindirizzamento della registrazione app Azure

Eseguire l'app.
```
dotnet run --launch-profile https
```
Passare all'endpoint sicuro dell'app, https://localhost:5001/ad esempio .
- Viene eseguito il rendering della pagina Indice senza verifica di autenticazione.
- L'intestazione include un collegamento Accedi perché non si è autenticati.
Selezionare il collegamento Privacy.
- Il browser viene reindirizzato al metodo di autenticazione configurato del tenant.
- Dopo l'accesso, l'intestazione visualizza un messaggio di benvenuto e un collegamento Disconnetti .

Passaggi successivi

In questa esercitazione si è appreso come configurare un'app ASP.NET Core per l'autenticazione con Azure AD B2C.

Ora che l'app ASP.NET Core è configurata per l'uso di Azure AD B2C per l'autenticazione, è possibile usare l'attributo Authorize per proteggere l'app. Continuare a sviluppare l'app imparando a:

Personalizzare l'interfaccia utente di Azure AD B2C.
Configurare i requisiti di complessità delle password.
Abilitare l'autenticazione a più fattori.
Configurare provider di identità aggiuntivi, ad esempio Microsoft, Facebook, Google, Amazon, Twitter e altri.
Usare l'API Microsoft Graph per recuperare informazioni utente aggiuntive, ad esempio l'appartenenza al gruppo, dal tenant di Azure AD B2C.
Come proteggere un'API Web compilata con ASP.NET Core usando Azure AD B2C.
Esercitazione: Concedere l'accesso a un'API Web ASP.NET usando Azure Active Directory B2C.