Creare un'app Web ASP.NET con criteri di iscrizione, accesso, modifica del profilo e reimpostazione della password di Azure Active Directory B2CCreate an ASP.NET web app with Azure Active Directory B2C sign-up, sign-in, profile edit, and password reset

Questa esercitazione illustra come:This tutorial shows you how to:

  • Aggiungere funzionalità di identità di Azure AD B2C all'app WebAdd Azure AD B2C identity features to your web app
  • Registrare l'app Web nella directory Azure AD B2CRegister your web app in your Azure AD B2C directory
  • Creare criteri di iscrizione/accesso, modifica del profilo e reimpostazione della password per l'app WebCreate a user sign-up/sign-in, profile edit, and password reset policy for your web app

PrerequisitiPrerequisites

  • È necessario connettere il tenant B2C a un account Azure.You must connect your B2C Tenant to an Azure account. È possibile creare un account Azure gratuito qui.You can create a free Azure account here.
  • Per visualizzare e modificare il codice di esempio, è necessario Microsoft Visual Studio o un programma simile.You need Microsoft Visual Studio or a similar program to view and modify the sample code.

Creare una directory Azure AD B2CCreate an Azure AD B2C directory

Prima di poter usare Azure AD B2C, è necessario creare una directory, o tenant.Before you can use Azure AD B2C, you must create a directory, or tenant. Una directory è un contenitore per utenti, app, gruppi e altro ancora.A directory is a container for all your users, apps, groups, and more. Se non è già stato fatto, creare una directory B2C prima di continuare con questa guida.If you don't have one already, create a B2C directory before you continue in this guide.

Fare clic sul pulsante Nuovo.Click the New button. Nel campo Cerca nel Marketplace immettere Azure Active Directory B2C.In the Search the marketplace field, enter Azure Active Directory B2C.

Pulsante Aggiungi evidenziato e testo Azure Active Directory B2C nel campo Cerca nel Marketplace

Nell'elenco risultati selezionare Azure Active Directory B2C.In the results list, select Azure Active Directory B2C.

Azure Active Directory B2C selezionato nell'elenco risultati

Vengono visualizzate informazioni dettagliate su Azure Active Directory B2C.Details about Azure Active Directory B2C are shown. Per iniziare la configurazione del nuovo tenant di Azure Active Directory B2C, fare clic sul pulsante Crea.To begin configuring your new Azure Active Directory B2C tenant, click the Create button.

Selezionare Crea un nuovo tenant Azure AD B2C.Select Create a new Azure AD B2C Tenant. Le impostazioni specificate nella tabella seguente usano il nome dell'azienda Contoso come esempio.The settings specified in the following table use the company name Contoso as an example. Sarà necessario specificare il nome della propria organizzazione e un nome univoco per il tenant durante la creazione del proprio tenant.You will need to provide your own organization name and a unique tenant name when creating your tenant.

Creazione di un tenant di Azure AD B2C con testo di esempio nei campi disponibili

ImpostazioneSetting Valore di esempioSample value DescrizioneDescription
Nome organizzazioneOrganization name ContosoContoso Nome dell'organizzazione.Name of the organization.
Nome di dominio inizialeInitial domain name ContosoB2CTenantContosoB2CTenant Nome di dominio per il tenant B2C.Domain name for the B2C tenant. Per impostazione predefinita, il nome di dominio iniziale include .onmicrosoft.com. Se si sta creando un tenant di test, scegliere un nome non di produzione, ad esempio ContosoB2CTesting.By default, the initial domain name includes .onmicrosoft.com. If you are creating a test tenant, choose a non-production name such as ContosoB2CTesting.
Paese o area geograficaCountry or region Stati UnitiUnited States Scegliere il paese o l'area geografica per la directory.Choose the country or region for the directory. La directory verrà creata in questa posizione e non può essere modificata in seguito.The directory will be created in this location and cannot be changed later.

Fare clic sul pulsante Crea per creare il tenant.Click the Create button to create your tenant. La creazione di un tenant potrebbe richiedere alcuni minuti.Creating the tenant may take a few minutes. Al termine della creazione, si riceve una notifica.You are alerted in your notifications when it is complete.

Nota

È necessario connettere il tenant B2C alla sottoscrizione di Azure.You need to connect the B2C Tenant to your Azure subscription. Dopo aver selezionato Crea, selezionare l'opzione Collega un tenant Azure AD B2C esistente alla sottoscrizione di Azure e quindi selezionare il tenant che si vuole associare nell'elenco a discesa Tenant Azure AD B2C.After selecting Create, select the Link an existing Azure AD B2C Tenant to my Azure subscription option, and then in the Azure AD B2C Tenant drop down, select the tenant you want to associate.

Creare e registrare un'applicazioneCreate and register an application

È quindi necessario creare e registrare l'app nella directory B2C.Next, you need to create and register the app in your B2C directory. In questo modo, si forniscono ad Azure AD B2C le informazioni necessarie per comunicare in modo sicuro con l'app.This provides information that Azure AD B2C needs to securely communicate with your app.

Nelle impostazioni di B2C fare clic su Applicazioni e quindi su + Aggiungi.In the B2C settings, click Applications and then click + Add.

Pulsante + Aggiungi in Applicazioni

Per registrare l'API Web, usare le impostazioni specificate nella tabella.To register your web API, use the settings specified in the table.

Impostazioni di registrazione di esempio per una nuova API Web

ImpostazioneSetting Valore di esempioSample value DescrizioneDescription
NomeName API Contoso B2CContoso B2C API Immettere un Nome per l'applicazione che illustra l'API ai clienti.Enter a Name for the application that describes your API to consumers.
Includi app Web/API WebInclude web app / web API Yes Selezionare per un'API Web.Select Yes for a web API.
Consenti il flusso implicitoAllow implicit flow Yes Selezionare se l'applicazione usa l'accesso con OpenID Connect.Select Yes if your application uses OpenID Connect sign-in
URL di rispostaReply URL https://localhost:44316/ Gli URL di risposta sono gli endpoint a cui Azure AD B2C restituisce eventuali token richiesti dall'applicazione.Reply URLs are endpoints where Azure AD B2C returns any tokens that your application requests. Immettere un URL di risposta appropriato.Enter a proper Reply URL. In questo esempio l'API Web è locale ed è in ascolto sulla porta 44316.In this example, your web API is local and listening on port 44316.
URI ID appApp ID URI apiapi L'URI ID app è l'identificatore usato per l'API Web.The App ID URI is the identifier used for your web API. L'URI completo dell'identificatore, incluso il dominio, viene generato automaticamente.The full identifier URI including the domain is generated for you.

Fare clic su Crea per registrare l'applicazione.Click Create to register your application.

L'applicazione appena registrata viene visualizzata nell'elenco di applicazioni per il tenant B2C.Your newly registered application is displayed in the applications list for the B2C tenant. Selezionare l'API Web dall'elenco.Select your web API from the list. Viene visualizzato il riquadro delle proprietà dell'API.The API's property pane is displayed.

Proprietà dell'API Web

Annotare l'ID client applicazione univoco a livello globale.Make note of the globally unique Application Client ID. L'ID viene usato nel codice dell'applicazione.You use the ID in your application's code.

Importante

Non è possibile usare le applicazioni registrate nella scheda Applicazioni del portale di gestione di Azure per questa operazione.You cannot use applications registered in the Applications tab on the classic Azure Management Portal for this.

Al termine, le impostazioni dell'applicazione includeranno un'API e un'applicazione nativa.When you are done, you will have both an API and a native application in your application settings.

Creare criteri nel tenant B2CCreate policies on your B2C tenant

In Azure AD B2C ogni esperienza utente è definita da criterispecifici.In Azure AD B2C, every user experience is defined by a policy. Questo esempio di codice contiene tre esperienze di identità: iscrizione e accesso, modifica del profilo e reimpostazione della password.This code sample contains three identity experiences: sign-up & sign-in, profile edit, and password reset. È necessario creare i criteri per ogni tipo, come descritto nell' articolo di riferimento per i criteri.You need to create one policy of each type, as described in the policy reference article. Per ogni criterio, assicurarsi di selezionare l'attributo o attestazione per il nome visualizzato e di copiare il nome del criterio per usarlo in seguito.For each policy, be sure to select the Display name attribute or claim, and to copy down the name of your policy for later use.

Aggiungere i provider di identitàAdd your identity providers

Dalle impostazioni selezionare Provider di identità e scegliere l'iscrizione tramite nome utente o posta elettronica.From your settings, select Identity Providers and choose Username signup or Email signup.

Creare criteri di iscrizione e di accessoCreate a sign-up and sign-in policy

Per abilitare l'accesso nell'applicazione, è necessario creare i criteri di accesso.To enable sign-in on your application, you will need to create a sign-in policy. I criteri descrivono l'esperienza utente durante la procedura di accesso e il contenuto dei token che l'applicazione riceverà al completamento dell'accesso.This policy describes the experiences that consumers will go through during sign-in and the contents of tokens that the application will receive on successful sign-ins.

Selezionare Azure AD B2C dall'elenco di servizi nel portale di Azure.Select Azure AD B2C from the services list in the Azure portal.

Selezionare il servizio B2C

Nella sezione delle impostazioni relativa ai criteri selezionare Criteri di iscrizione o di accesso e fare clic su + Aggiungi.In the policies section of settings, select Sign-up or sign-in policies and click + Add.

Selezionare i criteri di iscrizione o di accesso e fare clic sul pulsante Aggiungi

Immettere un Nome di criterio a cui l'applicazione può fare riferimento.Enter a policy Name for your application to reference. Ad esempio, immettere SiUpIn.For example, enter SiUpIn.

Selezionare Provider di identità e quindi selezionare Iscrizione posta elettronica.Select Identity providers and check Email signup. Facoltativamente, è anche possibile selezionare i provider di identità tramite social network, se già configurati.Optionally, you can also select social identity providers, if already configured. Fare clic su OK.Click OK.

Selezionare Iscrizione posta elettronica come provider di identità e quindi fare clic sul pulsante OK

Selezionare Attributi di iscrizione.Select Sign-up attributes. Scegliere gli attributi da raccogliere dall'utente durante l'iscrizione.Choose attributes you want to collect from the consumer during sign-up. Selezionare ad esempio Paese/area geografica, Nome visualizzato e Codice postale.For example, check Country/Region, Display Name, and Postal Code. Fare clic su OK.Click OK.

Selezionare alcuni attributi e fare clic sul pulsante OK

Selezionare Attestazioni dell'applicazione.Select Application claims. Scegliere le attestazioni che devono essere restituite nei token di autorizzazione inviati all'applicazione dopo un'esperienza di iscrizione o accesso riuscita.Choose claims you want returned in the authorization tokens sent back to your application after a successful sign-up or sign-in experience. Selezionare ad esempio Nome visualizzato, Provider di identità, Codice postale, Nuovo utente e ID oggetto dell'utente.For example, select Display Name, Identity Provider, Postal Code, User is new and User's Object ID.

Selezionare alcune attestazioni dell'applicazione e fare clic sul pulsante OK

Fare clic su Crea per aggiungere il criterio.Click Create to add the policy. Il criterio viene elencato come B2C_1_SiUpIn.The policy is listed as B2C_1_SiUpIn. Il prefisso B2C_1_ viene aggiunto al nome.The B2C_1_ prefix is appended to the name.

Aprire i criteri facendo clic su B2C_1_SiUpIn.Open the policy by selecting B2C_1_SiUpIn. Verificare le impostazioni specificate nella tabella e quindi fare clic su Esegui adesso.Verify the settings specified in the table then click Run now.

Selezionare un criterio ed eseguirlo

ImpostazioneSetting ValoreValue
ApplicazioniApplications App Contoso B2CContoso B2C app
Selezionare l'URL di rispostaSelect reply url https://localhost:44316/

Viene visualizzata una nuova scheda del browser ed è possibile verificare l'esperienza di iscrizione o di accesso dell'utente in base alla configurazione specificata.A new browser tab opens, and you can verify the sign-up or sign-in consumer experience as configured.

Nota

La creazione e gli aggiornamenti dei criteri avranno effetto dopo circa un minuto.It takes up to a minute for policy creation and updates to take effect.

Creare i criteri di modifica del profiloCreate a profile editing policy

Per abilitare la modifica del profilo nell'applicazione, è necessario creare i criteri di modifica del profilo.To enable profile editing on your application, you will need to create a profile editing policy. Questi criteri descrivono l'esperienza utente durante la procedura di modifica del profilo e il contenuto dei token che l'applicazione riceverà al completamento della procedura.This policy describes the experiences that consumers will go through during profile editing and the contents of tokens that the application will receive on successful completion.

Selezionare Azure AD B2C dall'elenco di servizi nel portale di Azure.Select Azure AD B2C from the services list in the Azure portal.

Selezionare il servizio B2C

Nella sezione delle impostazioni relativa ai criteri selezionare Criteri di modifica del profilo e fare clic su + Aggiungi.In the policies section of settings, select Profile editing policies and click + Add.

Selezionare Criteri di modifica del profilo e fare clic sul pulsante Aggiungi

Immettere un Nome di criterio a cui l'applicazione può fare riferimento.Enter a policy Name for your application to reference. Ad esempio, immettere SiPe.For example, enter SiPe.

Selezionare Provider di identità e quindi selezionareAccesso all'account locale.Select Identity providers and check Local Account Signin. Facoltativamente, è anche possibile selezionare i provider di identità tramite social network, se già configurati.Optionally, you can also select social identity providers, if already configured. Fare clic su OK.Click OK.

Selezionare Accesso all'account locale come provider di identità e quindi fare clic sul pulsante OK

Selezionare Attributi del profilo.Select Profile attributes. Scegliere gli attributi che l'utente può visualizzare e modificare nel profilo.Choose attributes the consumer can view and edit in their profile. Selezionare ad esempio Paese/area geografica, Nome visualizzato e Codice postale.For example, check Country/Region, Display Name, and Postal Code. Fare clic su OK.Click OK.

Selezionare alcuni attributi e fare clic sul pulsante OK

Selezionare Attestazioni dell'applicazione.Select Application claims. Scegliere le attestazioni che devono essere restituite nei token di autorizzazione inviati all'applicazione dopo un'esperienza di modifica del profilo riuscita.Choose claims you want returned in the authorization tokens sent back to your application after a successful profile editing experience. Selezionare ad esempio Nome visualizzato e Codice postale.For example, select Display Name, Postal Code.

Selezionare alcune attestazioni dell'applicazione e fare clic sul pulsante OK

Fare clic su Crea per aggiungere il criterio.Click Create to add the policy. Il criterio viene elencato come B2C_1_SiPe.The policy is listed as B2C_1_SiPe. Il prefisso B2C_1_ viene aggiunto al nome.The B2C_1_ prefix is appended to the name.

Aprire i criteri selezionando B2C_1_SiPe.Open the policy by selecting B2C_1_SiPe. Verificare le impostazioni specificate nella tabella e quindi fare clic su Esegui adesso.Verify the settings specified in the table then click Run now.

Selezionare un criterio ed eseguirlo

ImpostazioneSetting ValoreValue
ApplicazioniApplications App Contoso B2CContoso B2C app
Selezionare l'URL di rispostaSelect reply url https://localhost:44316/

Viene visualizzata una nuova scheda del browser ed è possibile verificare l'esperienza di modifica del profilo dell'utente in base alla configurazione specificata.A new browser tab opens, and you can verify the profile editing consumer experience as configured.

Nota

La creazione e gli aggiornamenti dei criteri avranno effetto dopo circa un minuto.It takes up to a minute for policy creation and updates to take effect.

Creare i criteri di reimpostazione delle passwordCreate a password reset policy

Per abilitare una reimpostazione dettagliata delle password nell'applicazione, è necessario creare criteri di reimpostazione delle password.To enable fine-grained password reset on your application, you will need to create a password reset policy. Annotare l'opzione di reimpostazione delle password a livello di tenant specificata qui.Note that the tenant-wide password reset option specified here. Questi criteri descrivono l'esperienza utente durante la procedura di reimpostazione delle password e il contenuto dei token che l'applicazione riceverà al completamento della procedura.This policy describes the experiences that the consumers will go through during password reset and the contents of tokens that the application will receive on successful completion.

Selezionare Azure AD B2C dall'elenco di servizi nel portale di Azure.Select Azure AD B2C from the services list in the Azure portal.

Selezionare il servizio B2C

Nella sezione delle impostazioni relativa ai criteri selezionare Criteri di reimpostazione password e fare clic su + Aggiungi.In the policies section of settings, select Password reset policies and click + Add.

Selezionare i criteri di iscrizione o di accesso e fare clic sul pulsante Aggiungi

Immettere un Nome di criterio a cui l'applicazione può fare riferimento.Enter a policy Name for your application to reference. Ad esempio, immettere SSPR.For example, enter SSPR.

Selezionare Provider di identità e quindi selezionare Reimposta la password usando l'indirizzo di posta elettronica.Select Identity providers and check Reset password using email address. Fare clic su OK.Click OK.

Selezionare Reimposta la password usando l'indirizzo di posta elettronica come provider di identità e fare clic sul pulsante OK

Selezionare Attestazioni dell'applicazione.Select Application claims. Scegliere le attestazioni che devono essere restituite nei token di autorizzazione inviati all'applicazione dopo un'esperienza di reimpostazione della password riuscita.Choose claims you want returned in the authorization tokens sent back to your application after a successful password reset experience. Selezionare ad esempio ID oggetto dell'utente.For example, select User's Object ID.

Selezionare alcune attestazioni dell'applicazione e fare clic sul pulsante OK

Fare clic su Crea per aggiungere il criterio.Click Create to add the policy. Il criterio viene elencato come B2C_1_SSPR.The policy is listed as B2C_1_SSPR. Il prefisso B2C_1_ viene aggiunto al nome.The B2C_1_ prefix is appended to the name.

Aprire i criteri selezionando B2C_1_SSPR.Open the policy by selecting B2C_1_SSPR. Verificare le impostazioni specificate nella tabella e quindi fare clic su Esegui adesso.Verify the settings specified in the table then click Run now.

Selezionare un criterio ed eseguirlo

ImpostazioneSetting ValoreValue
ApplicazioniApplications App Contoso B2CContoso B2C app
Selezionare l'URL di rispostaSelect reply url https://localhost:44316/

Viene visualizzata una nuova scheda del browser ed è possibile verificare l'esperienza di reimpostazione della password dell'utente nell'applicazione.A new browser tab opens, and you can verify the password reset consumer experience in your application.

Nota

La creazione e gli aggiornamenti dei criteri avranno effetto dopo circa un minuto.It takes up to a minute for policy creation and updates to take effect.

Dopo aver creato i criteri è possibile passare alla compilazione dell'app.After you create your policies, you're ready to build your app.

Scaricare il codice di esempioDownload the sample code

Il codice per questa esercitazione è salvato su GitHub.The code for this tutorial is maintained on GitHub. È possibile clonare l'esempio eseguendo:You can clone the sample by running:

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

Dopo aver scaricato il codice di esempio, aprire il file SLN di Visual Studio per iniziare.After you download the sample code, open the Visual Studio .sln file to get started. Il file della soluzione contiene due progetti: TaskWebApp e TaskService.The solution file contains two projects: TaskWebApp and TaskService. TaskWebApp è l'applicazione Web MVC con cui l'utente interagisce.TaskWebApp is the MVC web application that the user interacts with. TaskService è l'API Web back-end dell'app in cui viene archiviato l'elenco attività di ogni utente.TaskService is the app's back-end web API that stores each user's to-do list. Questo articolo illustra solo l'applicazione TaskWebApp.This article will only discuss the TaskWebApp application. Per informazioni su come compilare TaskService usando Azure AD B2C, vedere l'esercitazione sulle API Web .NET.To learn how to build TaskService using Azure AD B2C, see our .NET web api tutorial.

Aggiornare il codice per usare il tenant e i criteriUpdate code to use your tenant and policies

L'esempio è configurato per l'uso dei criteri e dell'ID client del tenant demo.Our sample is configured to use the policies and client ID of our demo tenant. Per connetterlo al tenant, è necessario aprire web.config nel progetto TaskWebApp e sostituire i valori seguenti:To connect it to your own tenant, you need to open web.config in the TaskWebApp project and replace the following values:

  • ida:Tenant con il nome del tenantida:Tenant with your tenant name
  • ida:ClientId con l'ID dell'applicazione di tipo app Webida:ClientId with your web app application ID
  • ida:ClientSecret con la chiave privata dell'app Webida:ClientSecret with your web app secret key
  • ida:SignUpSignInPolicyId con il nome del criterio "Iscrizione o accesso"ida:SignUpSignInPolicyId with your "Sign-up or Sign-in" policy name
  • ida:EditProfilePolicyId con il nome del criterio "Modifica profilo"ida:EditProfilePolicyId with your "Edit Profile" policy name
  • ida:ResetPasswordPolicyId con il nome del criterio "Reimposta password"ida:ResetPasswordPolicyId with your "Reset Password" policy name

Avviare l'appLaunch the app

Avviare l'app da Visual Studio.From within Visual Studio, launch the app. Passare alla scheda Elenco attività e notare che l'URI è: https://login.microsoftonline.com/*NomeTenant*/oauth2/v2.0/authorize?p=*NomeCriterioIscrizione*&client_id=*IDClient*.....Navigate to the To-Do List tab, and note the URl is: https://login.microsoftonline.com/*YourTenantName*/oauth2/v2.0/authorize?p=*YourSignUpPolicyName*&client_id=*YourclientID*.....

Effettuare l'iscrizione all'app usando un indirizzo e-mail o un nome utente.Sign up for the app by using your email address or user name. Disconnettersi, quindi accedere di nuovo e modificare il profilo o reimpostare la password.Sign out, then sign in again and edit the profile or reset the password. Disconnettersi ed eseguire l'accesso usando un account utente diverso.Sign out and sign in as a different user.

Aggiungere i provider di identità per i social networkAdd social IDPs

Attualmente l'app supporta solo l'iscrizione e l'accesso dell'utente con account locali, ovvero gli account archiviati nella directory B2C che usano un nome utente e una password.Currently, the app supports only user sign-up and sign-in by using local accounts; accounts stored in your B2C directory that use a user name and password. Tramite Azure AD B2C è possibile aggiungere il supporto per altri provider di identità (IdP) senza modificare il codice.By using Azure AD B2C, you can add support for other identity providers (IDPs) without changing any of your code.

Per aggiungere provider di identità per i social media all'applicazione, seguire le istruzioni dettagliate fornite in questi articoli.To add social IDPs to your app, begin by following the detailed instructions in these articles. Per ogni provider di identità che si vuole supportare, è necessario registrare un'applicazione nel relativo sistema e ottenere un ID client.For each IDP you want to support, you need to register an application in that system and obtain a client ID.

Dopo aver aggiunto i provider di identità alla directory B2C, modificare ognuno dei tre criteri per includere i nuovi provider di identità, come descritto nelle informazioni di riferimento sui criteri.After you add the identity providers to your B2C directory, edit each of your three policies to include the new IDPs, as described in the policy reference article. Dopo aver salvato i criteri, eseguire nuovamente l'app.After you save your policies, run the app again. I nuovi provider di identità dovrebbero essere stati aggiunti tra le opzioni di accesso e iscrizione in ognuna delle esperienze per l'identità.You should see the new IDPs added as sign-in and sign-up options in each of your identity experiences.

Provare a usare i criteri e osservare gli effetti sull'app di esempio.You can experiment with your policies and observe the effect on your sample app. Aggiungere o rimuovere provider di identità, manipolare le attestazioni dell'applicazione o modificare gli attributi per l'iscrizione.Add or remove IDPs, manipulate application claims, or change sign-up attributes. Fare delle prove fino a quando non è chiaro il modo in cui criteri, richieste di autenticazione e OWIN sono collegati tra loro.Experiment until you can see how policies, authentication requests, and OWIN tie together.

Procedura dettagliata per il codice di esempioSample code walkthrough

Le sezioni seguenti mostrano la configurazione del codice dell'applicazione di esempio.The following sections show you how the sample application code is configured. È possibile usare queste sezioni come guida per lo sviluppo dell'app.You may use this as a guide in your future app development.

Aggiungere il supporto per l'autenticazioneAdd authentication support

È ora possibile configurare l'app per l'uso di Azure AD B2C.You can now configure your app to use Azure AD B2C. L'app comunica con Azure AD B2C inviando richieste di autenticazione OpenID Connect.Your app communicates with Azure AD B2C by sending OpenID Connect authentication requests. Le richieste determinano l'esperienza dell'utente che l'app desidera eseguire specificando i criteri.The requests dictate the user experience your app wants to execute by specifying the policy. È possibile usare la libreria OWIN di Microsoft per inviare queste richieste, eseguire criteri, gestire le sessioni utente e così via.You can use Microsoft's OWIN library to send these requests, execute policies, manage user sessions, and more.

Installare OWINInstall OWIN

Per iniziare, aggiungere i pacchetti NuGet del middleware OWIN al progetto usando la Console di Gestione pacchetti di Visual Studio.To begin, add the OWIN middleware NuGet packages to the project by using the Visual Studio Package Manager Console.

PM> Install-Package Microsoft.Owin.Security.OpenIdConnect
PM> Install-Package Microsoft.Owin.Security.Cookies
PM> Install-Package Microsoft.Owin.Host.SystemWeb

Aggiungere una classe di avvio OWINAdd an OWIN startup class

Aggiungere una classe di avvio OWIN all'API denominata Startup.cs.Add an OWIN startup class to the API called Startup.cs. Fare clic con il pulsante destro del mouse sul progetto, scegliere Aggiungi e quindi Nuovo elemento e cercare "OWIN".Right-click on the project, select Add and New Item, and then search for OWIN. Il middleware OWIN richiamerà il metodo Configuration(…) all'avvio dell'app.The OWIN middleware will invoke the Configuration(…) method when your app starts.

In questo esempio la dichiarazione di classe è stata modificata in public partial class Startup ed è stata implementata l'altra parte della classe in App_Start\Startup.Auth.cs.In our sample, we changed the class declaration to public partial class Startup and implemented the other part of the class in App_Start\Startup.Auth.cs. Nel metodo Configuration è stata aggiunta una chiamata a ConfigureAuth, definita in Startup.Auth.cs.Inside the Configuration method, we added a call to ConfigureAuth, which is defined in Startup.Auth.cs. Dopo le modifiche, Startup.cs ha un aspetto analogo al seguente:After the modifications, Startup.cs looks like the following:

// Startup.cs

public partial class Startup
{
    // The OWIN middleware will invoke this method when the app starts
    public void Configuration(IAppBuilder app)
    {
        // ConfigureAuth defined in other part of the class
        ConfigureAuth(app);
    }
}

Configurazione del middleware di autenticazioneConfigure the authentication middleware

Aprire il file App_Start\Startup.Auth.cs e implementare il metodo ConfigureAuth(...).Open the file App_Start\Startup.Auth.cs and implement the ConfigureAuth(...) method. I parametri indicati in OpenIdConnectAuthenticationOptions fungono da coordinate per consentire all'app di comunicare con Azure AD B2C.The parameters you provide in OpenIdConnectAuthenticationOptions serve as coordinates for your app to communicate with Azure AD B2C. Se non si specificano determinati parametri, verrà usato il valore predefinito.If you do not specify certain parameters, it will use the default value. Ad esempio, nell'esercitazione non viene specificato ResponseType, pertanto il valore predefinito code id_token verrà usato in ciascuna richiesta in uscita per Azure AD B2C.For example, we do not specify the ResponseType in the sample, so the default value code id_token will be used in each outgoing request to Azure AD B2C.

È necessario configurare anche l'autenticazione tramite cookie.You also need to set up cookie authentication. Il middleware OpenID Connect usa i cookie per gestire, tra l'altro, le sessioni utente.The OpenID Connect middleware uses cookies to maintain user sessions, among other things.

// App_Start\Startup.Auth.cs

public partial class Startup
{
    // Initialize variables ...

    // Configure the OWIN middleware
    public void ConfigureAuth(IAppBuilder app)
    {
        app.UseCookieAuthentication(new CookieAuthenticationOptions());
        app.SetDefaultSignInAsAuthenticationType(CookieAuthenticationDefaults.AuthenticationType);

        app.UseOpenIdConnectAuthentication(
            new OpenIdConnectAuthenticationOptions
            {
                // Generate the metadata address using the tenant and policy information
                MetadataAddress = String.Format(AadInstance, Tenant, DefaultPolicy),

                // These are standard OpenID Connect parameters, with values pulled from web.config
                ClientId = ClientId,
                RedirectUri = RedirectUri,
                PostLogoutRedirectUri = RedirectUri,

                // Specify the callbacks for each type of notifications
                Notifications = new OpenIdConnectAuthenticationNotifications
                {
                    RedirectToIdentityProvider = OnRedirectToIdentityProvider,
                    AuthorizationCodeReceived = OnAuthorizationCodeReceived,
                    AuthenticationFailed = OnAuthenticationFailed,
                },

                // Specify the claims to validate
                TokenValidationParameters = new TokenValidationParameters
                {
                    NameClaimType = "name"
                },

                // Specify the scope by appending all of the scopes requested into one string (seperated by a blank space)
                Scope = $"{OpenIdConnectScopes.OpenId} {ReadTasksScope} {WriteTasksScope}"
            }
        );
    }

    // Implement the "Notification" methods...
}

In OpenIdConnectAuthenticationOptions sopra, si definisce un set di funzioni di callback per le notifiche specifiche che vengono ricevute dal middleware OpenID Connect.In OpenIdConnectAuthenticationOptions above, we define a set of callback functions for specific notifications that are received by the OpenID Connect middleware. Questi comportamenti vengono definiti usando un oggetto OpenIdConnectAuthenticationNotifications memorizzato nella variabile Notifications.These behaviors are defined using a OpenIdConnectAuthenticationNotifications object and stored into the Notifications variable. Nell'esempio vengono definiti tre diversi callback a seconda dell'evento.In our sample, we define three different callbacks depending on the event.

Uso di criteri diversiUsing different policies

La notifica RedirectToIdentityProvider viene attivata ogni volta che viene effettuata una richiesta per Azure AD B2C.The RedirectToIdentityProvider notification is triggered whenever a request is made to Azure AD B2C. Nella funzione di callback OnRedirectToIdentityProvider, se si desidera usare criteri diversi è necessario controllare la chiamata in uscita.In the callback function OnRedirectToIdentityProvider, we check in the outgoing call if we want to use a different policy. Per reimpostare la password o modificare un profilo, è necessario usare i criteri corrispondenti, ad esempio i criteri di reimpostazione della password anziché i criteri predefiniti di "registrazione o accesso".In order to do a password reset or edit a profile, you need to use the corresponding policy such as the password reset policy instead of the default "Sign-up or Sign-in" policy.

Nell'esempio quando un utente desidera reimpostare la password o modificare il profilo, vengono aggiunti i criteri che si desidera usare nel contesto di OWIN.In our sample, when a user wants to reset the password or edit the profile, we add the policy we prefer to use into the OWIN context. È possibile fare tutto questo effettuando le operazioni seguenti:That can be done by doing the following:

    // Let the middleware know you are trying to use the edit profile policy
    HttpContext.GetOwinContext().Set("Policy", EditProfilePolicyId);

È inoltre possibile implementare la funzione di callback OnRedirectToIdentityProvider effettuando le operazioni seguenti:And you can implement the callback function OnRedirectToIdentityProvider by doing the following:

/*
*  On each call to Azure AD B2C, check if a policy (e.g. the profile edit or password reset policy) has been specified in the OWIN context.
*  If so, use that policy when making the call. Also, don't request a code (since it won't be needed).
*/
private Task OnRedirectToIdentityProvider(RedirectToIdentityProviderNotification<OpenIdConnectMessage, OpenIdConnectAuthenticationOptions> notification)
{
    var policy = notification.OwinContext.Get<string>("Policy");

    if (!string.IsNullOrEmpty(policy) && !policy.Equals(DefaultPolicy))
    {
        notification.ProtocolMessage.Scope = OpenIdConnectScopes.OpenId;
        notification.ProtocolMessage.ResponseType = OpenIdConnectResponseTypes.IdToken;
        notification.ProtocolMessage.IssuerAddress = notification.ProtocolMessage.IssuerAddress.Replace(DefaultPolicy, policy);
    }

    return Task.FromResult(0);
}

Gestione dei codici di autorizzazioneHandling authorization codes

La notifica AuthorizationCodeReceived viene attivata quando si riceve un codice di autorizzazione.The AuthorizationCodeReceived notification is triggered when an authorization code is received. Il middleware OpenID Connect non supporta lo scambio di codici per i token di accesso.The OpenID Connect middleware does not support exchanging codes for access tokens. È possibile scambiare manualmente il codice per il token in una funzione di callback.You can manually exchange the code for the token in a callback function. Per altre informazioni, consultare la documentazione che spiega la procedura.For more information, please look at the documentation that explains how.

Gestione degli erroriHandling errors

La notifica AuthenticationFailed viene attivata quando l'autenticazione non ha esito positivo.The AuthenticationFailed notification is triggered when authentication fails. Nel metodo di callback è possibile gestire gli errori in base alle necessità.In its callback method, you can handle the errors as you wish. È tuttavia necessario aggiungere un controllo del codice di errore AADB2C90118.You should however add a check for the error code AADB2C90118. Durante l'esecuzione dei criteri di iscrizione o accesso, l'utente può fare clic sul collegamento Password dimenticata?.During the execution of the "Sign-up or Sign-in" policy, the user has the opportunity to select a Forgot your password? link. In questo caso, Azure AD B2C invia all'app il codice di errore che indica che l'app deve effettuare una richiesta usando i criteri di reimpostazione della password.In this event, Azure AD B2C sends your app that error code indicating that your app should make a request using the password reset policy instead.

/*
* Catch any failures received by the authentication middleware and handle appropriately
*/
private Task OnAuthenticationFailed(AuthenticationFailedNotification<OpenIdConnectMessage, OpenIdConnectAuthenticationOptions> notification)
{
    notification.HandleResponse();

    // Handle the error code that Azure AD B2C throws when trying to reset a password from the login page
    // because password reset is not supported by a "sign-up or sign-in policy"
    if (notification.ProtocolMessage.ErrorDescription != null && notification.ProtocolMessage.ErrorDescription.Contains("AADB2C90118"))
    {
        // If the user clicked the reset password link, redirect to the reset password route
        notification.Response.Redirect("/Account/ResetPassword");
    }
    else if (notification.Exception.Message == "access_denied")
    {
        notification.Response.Redirect("/");
    }
    else
    {
        notification.Response.Redirect("/Home/Error?message=" + notification.Exception.Message);
    }

    return Task.FromResult(0);
}

Inviare richieste di autenticazione ad Azure ADSend authentication requests to Azure AD

L'app è ora configurata correttamente per comunicare con Azure AD B2C usando il protocollo di autenticazione OpenID Connect.Your app is now properly configured to communicate with Azure AD B2C by using the OpenID Connect authentication protocol. OWIN gestisce i dettagli relativi alla creazione dei messaggi di autenticazione, alla convalida dei token da Azure AD B2C e alla gestione della sessione utente.OWIN manages the details of crafting authentication messages, validating tokens from Azure AD B2C, and maintaining user session. A questo punto, non resta che avviare ogni flusso utente.All that remains is to initiate each user's flow.

Quando un utente seleziona Accedi/Iscriviti, Modifica profilo o Reimposta password nell'app Web, l'azione associata viene richiamata in Controllers\AccountController.cs:When a user selects Sign up/Sign in, Edit profile, or Reset password in the web app, the associated action is invoked in Controllers\AccountController.cs:

// Controllers\AccountController.cs

/*
*  Called when requesting to sign up or sign in
*/
public void SignUpSignIn()
{
    // Use the default policy to process the sign up / sign in flow
    if (!Request.IsAuthenticated)
    {
        HttpContext.GetOwinContext().Authentication.Challenge();
        return;
    }

    Response.Redirect("/");
}

/*
*  Called when requesting to edit a profile
*/
public void EditProfile()
{
    if (Request.IsAuthenticated)
    {
        // Let the middleware know you are trying to use the edit profile policy (see OnRedirectToIdentityProvider in Startup.Auth.cs)
        HttpContext.GetOwinContext().Set("Policy", Startup.EditProfilePolicyId);

        // Set the page to redirect to after editing the profile
        var authenticationProperties = new AuthenticationProperties { RedirectUri = "/" };
        HttpContext.GetOwinContext().Authentication.Challenge(authenticationProperties);

        return;
    }

    Response.Redirect("/");

}

/*
*  Called when requesting to reset a password
*/
public void ResetPassword()
{
    // Let the middleware know you are trying to use the reset password policy (see OnRedirectToIdentityProvider in Startup.Auth.cs)
    HttpContext.GetOwinContext().Set("Policy", Startup.ResetPasswordPolicyId);

    // Set the page to redirect to after changing passwords
    var authenticationProperties = new AuthenticationProperties { RedirectUri = "/" };
    HttpContext.GetOwinContext().Authentication.Challenge(authenticationProperties);

    return;
}

È anche possibile usare OWIN per disconnettere l'utente dell'app.You can also use OWIN to sign out the user from the app. In Controllers\AccountController.cs c'è:In Controllers\AccountController.cs we have:

// Controllers\AccountController.cs

/*
*  Called when requesting to sign out
*/
public void SignOut()
{
    // To sign out the user, you should issue an OpenIDConnect sign out request.
    if (Request.IsAuthenticated)
    {
        IEnumerable<AuthenticationDescription> authTypes = HttpContext.GetOwinContext().Authentication.GetAuthenticationTypes();
        HttpContext.GetOwinContext().Authentication.SignOut(authTypes.Select(t => t.AuthenticationType).ToArray());
        Request.GetOwinContext().Authentication.GetAuthenticationTypes();
    }
}

Oltre a richiamare in modo esplicito i criteri, è possibile usare un tag [Authorize] nei controller per l'esecuzione dei criteri se l'utente non ha effettuato l'accesso.In addition to explicitly invoking a policy, you can use a [Authorize] tag in your controllers that executes a policy if the user is not signed in. Aprire Controllers\HomeController.cs e aggiungere il tag [Authorize] al controller delle attestazioni.Open Controllers\HomeController.cs and add the [Authorize] tag to the claims controller. Quando viene raggiunto il tag [Authorize] , OWIN seleziona l'ultimo criterio configurato.OWIN selects the last policy configured when the [Authorize] tag is hit.

// Controllers\HomeController.cs

// You can use the Authorize decorator to execute a certain policy if the user is not already signed into the app.
[Authorize]
public ActionResult Claims()
{
  ...

Visualizzare le informazioni utenteDisplay user information

Quando si autenticano gli utenti usando OpenID Connect, Azure AD B2C restituisce un token ID all'app che contiene le attestazioni.When you authenticate users by using OpenID Connect, Azure AD B2C returns an ID token to the app that contains claims. Si tratta di asserzioni sull'utente.These are assertions about the user. È possibile usare le attestazioni per personalizzare l'app.You can use claims to personalize your app.

Aprire il file Controllers\HomeController.cs .Open the Controllers\HomeController.cs file. È possibile accedere alle attestazioni utente nei controller tramite l'oggetto entità di sicurezza ClaimsPrincipal.Current .You can access user claims in your controllers via the ClaimsPrincipal.Current security principal object.

// Controllers\HomeController.cs

[Authorize]
public ActionResult Claims()
{
    Claim displayName = ClaimsPrincipal.Current.FindFirst(ClaimsPrincipal.Current.Identities.First().NameClaimType);
    ViewBag.DisplayName = displayName != null ? displayName.Value : string.Empty;
    return View();
}

È possibile accedere a qualsiasi attestazione ricevuta dall'applicazione nello stesso modo.You can access any claim that your application receives in the same way. Nella pagina Attestazioni è disponibile un elenco di tutte le attestazioni ricevute dall'app.A list of all the claims the app receives is available for you on the Claims page.