Condividi tramite

Guida introduttiva: Configurare l'accesso per un'applicazione ASP.NET con Azure Active Directory B2C

  • Articolo

Azure Active Directory B2C (Azure AD B2C) consente la gestione delle identità del cloud per garantire la protezione costante dell'applicazione, delle attività aziendali e dei clienti. Azure AD B2C consente alle applicazioni di eseguire l'autenticazione per account di social networking e account aziendali usando protocolli standard aperti.

In questa guida introduttiva si usa un'applicazione ASP.NET per eseguire l'accesso con un provider di identità basato su social network e chiamare un'API Web protetta da Azure AD B2C.

Prerequisiti

  • Visual Studio 2022 con il carico di lavoro Sviluppo ASP.NET e Web.

  • Un account di social networking di Facebook, Google o Microsoft.

  • Scaricare un file ZIP o clonare l'applicazione Web di esempio da GitHub.

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

    La soluzione di esempio contiene due progetti:

    • TaskWebApp: applicazione Web che crea e modifica un elenco attività. L'applicazione Web usa il flusso utente di iscrizione o accesso per l'iscrizione o l'accesso degli utenti.
    • TaskService: API Web che supporta le funzionalità di creazione, lettura, aggiornamento ed eliminazione dell'elenco attività. L'API Web è protetta da Azure AD B2C e viene chiamata dall'applicazione Web.

Eseguire l'applicazione in Visual Studio

  1. Nella cartella del progetto dell'applicazione di esempio aprire la soluzione B2C-WebAPI-DotNet.sln in Visual Studio.

  2. Per questa guida introduttiva si eseguono contemporaneamente entrambi i progetti TaskWebApp e TaskService. Fare clic con il pulsante destro del mouse sulla soluzione B2C-WebAPI-DotNet in Esplora soluzioni e quindi scegliere Configura progetti di avvio....

  3. Selezionare Progetti di avvio multipli e modificare l'impostazione di Azione in Avvia per entrambi i progetti.

  4. Selezionare OK.

  5. Premere F5 per eseguire il debug di entrambe le applicazioni. Ogni applicazione viene visualizzata in una scheda del browser separata:

    • https://localhost:44316/: applicazione Web ASP.NET. Nella guida introduttiva si interagisce direttamente con l'applicazione.
    • https://localhost:44332/: API Web chiamata dall'applicazione Web ASP.NET.

Eseguire l'accesso con il proprio account

  1. Selezionare Iscrizione/Accesso nell'applicazione Web ASP.NET per avviare il flusso di lavoro.

    Screenshot che mostra l'app Web di esempio ASP.NET nel browser con il collegamento di iscrizione/firma evidenziato

    L'esempio supporta alcune opzioni di iscrizione, tra cui l'uso di un provider di identità di social networking o la creazione di un account locale tramite un indirizzo di posta elettronica. Per questo argomento di avvio rapido, usare un account di provider di identità basato su social network, ovvero un account di Facebook, Google o Microsoft.

  2. Azure AD B2C presenta una pagina di accesso per un'azienda fittizia denominata Fabrikam per l'applicazione Web di esempio. Per iscriversi usando un provider di identità basato su social network, selezionare il pulsante del provider di identità che si vuole usare.

    Screenshot dei pulsanti del provider di identità della pagina Di accesso o iscrizione

    È necessario eseguire l'autenticazione (accesso) tramite le credenziali dell'account di social networking e autorizzare l'applicazione a leggere informazioni da questo account. Dopo la concessione dell'accesso, l'applicazione può recuperare le informazioni sul profilo dall'account, ad esempio il nome e la città dell'utente.

  3. Completare il processo di accesso per il provider di identità.

Modificare il profilo

Azure Active Directory B2C offre funzionalità che consentono agli utenti di aggiornare il profilo. L'app Web di esempio usa un flusso utente di modifica dei profili di Azure AD B2C per il flusso di lavoro.

  1. Nella barra dei menu dell'applicazione selezionare il nome del profilo e quindi selezionare Modifica profilo per modificare il profilo creato.

    Screenshot dell'app Web di esempio nel browser con il collegamento modifica profilo evidenziato

  2. Modificare il nome visualizzato o Città e quindi selezionare Continua per aggiornare il profilo.

    La modifica viene visualizzata nella parte superiore destra della home page dell'applicazione Web.

Accedere a una risorsa API protetta

  1. Selezionare To-Do Elenco per immettere e modificare le voci dell'elenco attività.

  2. Nella casella di testo Nuovo elemento immettere testo. Per chiamare l'API Web protetta di Azure AD B2C che aggiunge un elemento elenco attività, selezionare Aggiungi.

    Screenshot dell'app Web di esempio nel browser con To-Do collegamento Elenco e pulsante Aggiungi evidenziato.

    L'applicazione Web ASP.NET include un token di accesso Microsoft Entra nella richiesta alla risorsa API Web protetta per eseguire operazioni sugli elementi dell'elenco attività dell'utente.

L'account utente di Azure AD B2C è stato usato correttamente per effettuare una chiamata autorizzata a un'API Web protetta da Azure AD B2C.

Passaggi successivi

Creare un tenant di Azure Active Directory B2C nel portale di Azure