Verificatie configureren in een voorbeeldweb-app met behulp van Azure AD B2C

Belangrijk

Vanaf 1 mei 2025 is Azure AD B2C niet meer beschikbaar voor nieuwe klanten. Meer informatie vindt u in onze veelgestelde vragen.

In dit artikel wordt een voorbeeld van ASP.NET webtoepassing gebruikt om te laten zien hoe u Verificatie van Azure Active Directory B2C (Azure AD B2C) toevoegt aan uw webtoepassingen.

Belangrijk

De voorbeeld-ASP.NET-web-app waarnaar in dit artikel wordt verwezen, kan niet worden gebruikt om een REST API aan te roepen, omdat er een id-token wordt geretourneerd en geen toegangstoken. Zie Een web-API beveiligen die is gebouwd met ASP.NET Core met behulp van Azure AD B2C voor een web-app die een REST API kan aanroepen.

Overzicht

OpenID Connect (OIDC) is een verificatieprotocol dat is gebaseerd op OAuth 2.0. U kunt OIDC gebruiken om gebruikers veilig aan te melden bij een toepassing. Dit voorbeeld van een web-app maakt gebruik van Microsoft Identity Web. Microsoft Identity Web is een set ASP.NET Core-bibliotheken die het toevoegen van verificatie- en autorisatieondersteuning voor web-apps vereenvoudigen.

De aanmeldingsstroom omvat de volgende stappen:

1. Gebruikers gaan naar de webtoepassing en selecteren Aanmelden.
2. De app initieert een verificatieaanvraag en leidt gebruikers om naar Azure AD B2C.
3. Gebruikers registreren zich of melden zich aan en stellen het wachtwoord opnieuw in. Ze kunnen zich ook aanmelden met een sociaal account.
4. Nadat gebruikers zich hebben aangemeld, retourneert Azure AD B2C een id-token naar de app.
5. De app valideert het id-token, leest de claims en retourneert een beveiligde pagina aan gebruikers.

Wanneer het id-token is verlopen of de app-sessie ongeldig is, start de app een nieuwe verificatieaanvraag en leidt de gebruiker om naar Azure AD B2C. Als de sessie met eenmalige aanmelding van Azure AD B2C actief is, geeft Azure AD B2C een toegangstoken af zonder dat gebruikers zich opnieuw hoeven aan te melden. Als de Azure AD B2C-sessie verloopt of ongeldig wordt, worden gebruikers gevraagd zich opnieuw aan te melden.

Afmelden

De afmeldingsstroom omvat de volgende stappen:

1. Gebruikers melden zich af vanuit de app.
2. De app wist de sessieobjecten en de verificatiebibliotheek wist de token-cache.
3. De app brengt gebruikers naar het afmeldingseindpunt van Azure AD B2C om de Azure AD B2C-sessie te beëindigen.
4. Gebruikers worden teruggeleid naar de app.

Vereiste voorwaarden

Een computer waarop een van de volgende opties wordt uitgevoerd:

Visual Studio

• Visual Studio 2022 17.0 of hoger, met de workload ASP.NET en webontwikkeling
• .NET 6.0 SDK

Visual Studio Code

• Visual Studio Code
• C# voor Visual Studio Code (nieuwste versie)
• .NET 6.0 SDK

Stap 1: Uw gebruikersstroom configureren

Wanneer gebruikers zich proberen aan te melden bij uw app, start de app een verificatieaanvraag naar het autorisatie-eindpunt via een gebruikersstroom. De gebruikersstroom definieert en bepaalt de gebruikerservaring. Nadat gebruikers de gebruikersstroom hebben voltooid, genereert Azure AD B2C een token en leidt het gebruikers vervolgens terug naar de toepassing.

Maak een gebruikersstroom of een aangepast beleid als u dit nog niet hebt gedaan. Herhaal de stappen om de volgende drie afzonderlijke gebruikersstromen te maken:

• Een gecombineerde gebruikersstroom voor aanmelden en registreren, zoals susi. Deze gebruikersstroom ondersteunt ook de ervaring Wachtwoord vergeten.
• Een gebruikersstroom voor profielbewerking, zoals edit_profile.
• Een gebruikersstroom voor Wachtwoord opnieuw instellen, zoals reset_password.

Azure AD B2C voegt B2C_1_ aan de naam van de gebruikersstroom toe. susi wordt bijvoorbeeld B2C_1_susi.

Stap 2: Een webtoepassing registreren

Als u wilt dat uw toepassing zich kan aanmelden met Azure AD B2C, registreert u uw toepassing in de Azure AD B2C-map. Als u uw app registreert, wordt er een vertrouwensrelatie tot stand brengt tussen de app en Azure AD B2C.

Tijdens de app-registratie geeft u de omleidings-URI op. De omleidings-URI is het eindpunt waarnaar gebruikers worden geleid door Azure AD B2C nadat ze zich bij Azure AD B2C hebben geverifieerd. Het toepassingsregistratieproces genereert een toepassings-id, ook wel client-id genoemd, waarmee uw toepassing op unieke wijze wordt aangeduid. Nadat uw toepassing is geregistreerd, gebruikt Azure AD B2C zowel de toepassings-id als de omleidings-URI om verificatieaanvragen te maken.

Gebruik de volgende stappen om de registratie van de web-app te maken:

1. Meld u aan bij het Azure-portaal.

2. Als u toegang hebt tot meerdere tenants, selecteert u het pictogram Instellingen in het hoofdmenu om over te schakelen naar uw Azure AD B2C-tenant vanuit het menu Mappen + abonnementen.

3. Zoek en selecteer Azure AD B2C in de Azure-portal.

4. Selecteer App-registraties en selecteer vervolgens Nieuwe registratie.

5. Voer onder Naam een naam in voor de toepassing (bijvoorbeeld webapp1).

6. Selecteer onder Ondersteunde accounttypenAccounts in een id-provider of organisatiemap (voor verificatie van gebruikers met gebruikersstromen).

7. Selecteer onder Omleidings-URI de optie Web en voer vervolgens in het vak URL https://localhost:44316/signin-oidc in.

8. Schakel onder Beheren het selectievakje Verificatie in, ga naar Impliciete toekenning en hybride stromen, schakel het selectievakje ID-tokens in (gebruikt voor impliciete en hybride stromen).

9. Schakel onder Machtigingen het selectievakje Beheerdersgoedkeuring verlenen aan machtigingen van OpenID en offline_access in.

10. Selecteer Registreren.

11. Selecteer Overzicht.

12. Noteer voor later gebruik de toepassings-id (client) wanneer u de webtoepassing configureert.

    

Stap 3: Het voorbeeld van de web-app ophalen

Download het zip-bestand of kloon de voorbeeldwebtoepassing vanuit GitHub.

git clone https://github.com/Azure-Samples/active-directory-aspnetcore-webapp-openidconnect-v2

Pak het voorbeeldbestand uit naar een map waarin de totale lengte van het pad 260 of minder tekens is.

Stap 4: De voorbeeldweb-app configureren

Open in de voorbeeldmap onder de map 1-WebApp-OIDC/1-5-B2C/ het project WebApp-OpenIDConnect-DotNet.csproj met Visual Studio of Visual Studio Code.

Open het bestand appsettings.json in de hoofdmap van het project. Dit bestand bevat informatie over uw Azure AD B2C-id-provider. Werk de volgende eigenschappen van de app-instellingen bij:

Afdeling	Sleutelcode	Waarde
AzureAdB2C	Instantie	Het eerste deel van uw Azure AD B2C-tenantnaam (bijvoorbeeld). https://contoso.b2clogin.com
AzureAdB2C	Domein	De volledige tenantnaam van uw Azure AD B2C-tenant (bijvoorbeeld contoso.onmicrosoft.com).
AzureAdB2C	ClientId	De id van de web-apptoepassing (client) uit stap 2.
AzureAdB2C	RegistreerAanmeldBeleidId	De gebruikersstromen of het aangepaste beleid dat u in stap 1 hebt gemaakt.

Het uiteindelijke configuratiebestand moet eruitzien als de volgende JSON:

"AzureAdB2C": {
  "Instance": "https://contoso.b2clogin.com",
  "Domain": "contoso.onmicrosoft.com",
  "ClientId": "<web-app-application-id>",
  "SignedOutCallbackPath": "/signout/<your-sign-up-in-policy>",
  "SignUpSignInPolicyId": "<your-sign-up-in-policy>"
}

Stap 5: De voorbeeldweb-app uitvoeren

1. Bouw het project en voer het uit.

2. Ga naar https://localhost:44316.

3. Selecteer Registreren/aanmelden.

   

4. Voltooi het aanmeldings- of registratieproces.

Na een geslaagde verificatie ziet u uw weergavenaam op de navigatiebalk. Als u de claims wilt weergeven die het Azure AD B2C-token naar uw app retourneert, selecteert u Claims.

Uw toepassing implementeren

In een productietoepassing is de omleidings-URI voor app-registratie gewoonlijk een openbaar toegankelijk eindpunt waarop uw app wordt uitgevoerd, zoals https://contoso.com/signin-oidc.

U kunt op elk gewenst moment omleidings-URI's toevoegen en wijzigen in uw geregistreerde toepassingen. De volgende beperkingen zijn van toepassing op omleidings-URI's:

• De antwoord-URL moet beginnen met het schema https.
• De antwoord-URL is hoofdlettergevoelig. Het hoofdlettergebruik moet overeenkomen met het URL-pad van de actieve toepassing.

Volgende stappen

• Meer informatie over het codevoorbeeld.
• Meer informatie over het inschakelen van verificatie in uw eigen web-app met behulp van Azure AD B2C.