Quickstart: Aanmelding instellen voor een ASP.NET-toepassing met Azure Active Directory B2C

  • Artikel

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 kunnen uw toepassingen zich met behulp van open-standaardprotocollen te verifiëren bij sociale en enterpriseaccounts.

In deze snelstart gebruikt u een ASP.NET-toepassing. 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 2022 met de workload ASP.NET en webontwikkeling .

  • Een sociaal account van Facebook, Google of Microsoft.

  • Download een ZIP-bestand of kloon de voorbeeld-web-app vanuit GitHub.

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

    Er bevinden zich twee projecten in de voorbeeldoplossing:

    • TaskWebApp: een webtoepassing die een takenlijst maakt en bewerkt. De webtoepassing gebruikt de gebruikersstroom voor registratie of aanmelding om gebruikers te registreren of aan te melden.
    • TaskService: een web-API die ondersteuning biedt voor functionaliteit voor het maken, lezen, bijwerken en verwijderen van takenlijsten. De web-API wordt beveiligd door Azure AD B2C en wordt aangeroepen door de web-app.

De toepassing uitvoeren in Visual Studio

  1. In de projectmap van de voorbeeldtoepassing opent u de oplossing B2C-WebAPI-DotNet.sln in Visual Studio.

  2. Voor deze snelstart voert u de projecten TaskWebApp en TaskService tegelijk uit. Klik met de rechtermuisknop op de oplossing B2C-WebAPI-DotNet in Solution Explorer en selecteer Vervolgens Opstartprojecten configureren....

  3. Selecteer Meerdere opstartprojecten en wijzig de Actie voor beide projecten in Start.

  4. Selecteer OK.

  5. Druk op F5 om fouten in beide toepassingen op te sporen. Elke toepassing wordt geopend op een eigen browsertabblad:

    • https://localhost:44316/: de ASP.NET-webtoepassing. U communiceert rechtstreeks met deze toepassing in de snelstart.
    • https://localhost:44332/: de web-API die wordt aangeroepen door de ASP.NET-webtoepassing.

Aanmelden met uw account

  1. Selecteer in de ASP.NET-webtoepassing Registreren/Aanmelden om de werkstroom te starten.

    Schermopname van de voorbeeld-ASP.NET-web-app in de browser met de koppeling registreren/ondertekenen gemarkeerd

    In de voorbeeldtoepassing worden verschillende registratiemogelijkheden ondersteund. U kunt bijvoorbeeld een provider voor sociale identiteit gebruiken of een lokale account maken met behulp van een e-mailadres. Voor deze quickstart gebruikt u een account van een id-provider voor sociale netwerken (Facebook, Google of Microsoft).

  2. Azure AD B2C opent een aanmeldingspagina voor een fictief bedrijf genaamd Fabrikam voor het voorbeeld van de webtoepassing. 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.

    Schermopname van de knoppen voor id-provider op de pagina Aanmelden of Registreren

    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.

Het profiel bewerken

Azure Active Directory B2C biedt functionaliteit waarmee gebruikers hun profielen kunnen bijwerken. In de voorbeeldweb-app wordt een Azure AD B2C-gebruikersstroom voor profielbewerking gebruikt voor de werkstroom.

  1. Selecteer in de menubalk van de toepassing uw profielnaam en selecteer Profiel bewerken om het profiel te bewerken dat u hebt gemaakt.

    Schermopname van de voorbeeldweb-app in de browser met de koppeling Profiel bewerken gemarkeerd

  2. Wijzig uw weergavenaam of plaats en selecteer Doorgaan om uw profiel bij te werken.

    De wijziging wordt in de rechterbovenhoek van de startpagina van de webtoepassing weergegeven.

Toegang tot een beveiligde API-resource

  1. Selecteer Takenlijst om uw takenlijstitems in te voeren en te wijzigen.

  2. Voer tekst in het tekstvak Nieuw item in. Selecteer Toevoegen om de met Azure AD B2C beveiligde web-API aan te roepen, waarmee een takenlijstitem wordt toegevoegd.

    Schermopname van de voorbeeldweb-app in de browser met To-Do koppeling Lijst en knop Toevoegen gemarkeerd.

    De ASP.NET webtoepassing bevat een Microsoft Entra toegangstoken in de aanvraag voor de beveiligde web-API-resource om bewerkingen uit te voeren op de takenlijstitems van de gebruiker.

U hebt uw Azure AD B2C-gebruikersaccount gebruikt om een geautoriseerde aanroep te doen naar een Azure AD met B2C beveiligde web-API.

Volgende stappen

Een Azure Active Directory B2C-tenant maken in Azure Portal