Avvio rapido: Configurare l'accesso per un'app a singola pagina tramite Azure Active Directory B2C

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 di avvio rapido si usa un'applicazione a pagina singola 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 Code

• Node.js

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

• Esempio di codice da GitHub: ms-identity-b2c-javascript-spa:

  È possibile scaricare l'archivio ZIP o clonare il repository

  git clone https://github.com/Azure-Samples/ms-identity-b2c-javascript-spa.git
  

Eseguire l'applicazione

1. Avviare il server eseguendo questi comandi al prompt dei comandi di Node.js:

   npm install
   npm update
   npm start
   

   Il server avviato da server. js visualizza la porta su cui è in ascolto:

   Listening on port 6420...
   

2. Passare all'URL dell'applicazione. Ad esempio: http://localhost:6420.

Eseguire l'accesso con il proprio account

1. Selezionare Accedi per iniziare il percorso utente.

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.

   

   È 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à.

Accedere a una risorsa API protetta

Selezionare Call API (Chiama API) se si vuole che l'API Web restituisca il nome visualizzato come oggetto JSON.

L'applicazione a pagina singola include un token di accesso nella richiesta alla risorsa API Web protetta.

Passaggi successivi

• Introduzione alla creazione di un tenant di Azure Active Directory B2C nel portale di Azure