Quickstart: Aanmelding instellen voor een app met één pagina met behulp van Azure Active Directory B2C

Azure Active Directory B2C (Azure AD B2C) bevat functionaliteit voor identiteitsbeheer in de cloud ter bescherming van uw toepassing, bedrijf en klanten. Met Azure AD B2C zijn uw toepassingen in staat om zich met behulp van open-standaardprotocollen te verifiëren bij sociaalnetwerk- en Enterprise-accounts.

In deze snelstart gebruikt u een toepassing met één pagina. Deze toepassing wordt gebruikt voor het aanmelden via een id-provider voor sociale netwerken en voor het aanroepen van een met Azure AD B2C beveiligde web-API.

Vereisten

• Visual Studio Code

• Node.js

• Sociaal account van Facebook, Google of Microsoft

• Codevoorbeeld van GitHub: ms-identity-b2c-javascript-spa:

  U kunt het ZIP-archief downloaden of de opslagplaats klonen

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

De toepassing uitvoeren

1. Start de server door de volgende opdrachten uit te voeren vanaf de Node.js-opdrachtprompt:

   npm install
   npm update
   npm start
   

   De server die is gestart door server.js geeft de poort waarop deze luistert weer:

   Listening on port 6420...
   

2. Blader naar de URL van de toepassing. Bijvoorbeeld http://localhost:6420.

Aanmelden met uw account

1. Selecteer Aanmelden om het gebruikerstraject te starten.

2. Azure AD B2C opent een aanmeldingspagina voor een fictief bedrijf met de naam 'Fabrikam' voor het voorbeeld van de web-app. Selecteer de knop van de id-provider voor sociale netwerken die u wilt gebruiken om u aan te melden via een id-provider voor sociale netwerken.

   

   U moet zich verifiëren (aanmelden) met behulp van de referenties van uw sociaalnetwerkaccount en de toepassing autoriseren om informatie uit uw sociaalnetwerkaccount te lezen. Door toegang te verlenen, kan de toepassing profielgegevens van het sociaalnetwerkaccount ophalen, zoals uw naam en plaats.

3. Voltooi het aanmeldingsproces voor de id-provider.

Toegang tot een beveiligde API-resource

Klik op API aanroepen om de weergavenaam van de web-API als JSON-object te retourneren.

De voorbeeldtoepassing met één pagina bevat het toegangstoken van Azure AD in de aanvraag voor de beveiligde web-API-resource.

Volgende stappen

• Aan de slag met het maken van uw eigen Azure Active Directory B2C-tenant in de Azure Portal