Gebruikers aanmelden voor een voorbeeld-ASP.NET Core-web-app in een externe tenant

In deze handleiding wordt een voorbeeld van een ASP.NET Core-webtoepassing gebruikt om de basisprincipes van moderne verificatie weer te geven met behulp van de Microsoft Authentication Library voor .NET en Microsoft Identity Web voor ASP.NET Core voor het afhandelen van verificatie.

In dit artikel registreert u een webtoepassing in het Microsoft Entra-beheercentrum en maakt u een gebruikersstroom voor aanmelden en afmelden. U koppelt uw webtoepassing aan de gebruikersstroom, downloadt en werkt een voorbeeld-ASP.NET Core-webtoepassing bij met behulp van uw eigen externe tenantgegevens. Ten slotte voert u de voorbeeldwebtoepassing uit en test u deze.

Vereisten

• Hoewel elke IDE die ondersteuning biedt voor ASP.NET Core-toepassingen kan worden gebruikt, wordt Visual Studio Code gebruikt voor deze handleiding. Het kan worden gedownload vanaf de pagina Downloads .
• .NET 7.0 SDK.
• Een externe tenant. Kies een van de volgende methoden om er een te maken:
  • (Aanbevolen) Gebruik de Microsoft Entra Externe ID-extensie om rechtstreeks in Visual Studio Code een externe tenant in te stellen.
  • Maak een nieuwe externe tenant in het Microsoft Entra-beheercentrum.

De web-app registreren

Als u wilt dat uw toepassing gebruikers kan aanmelden met Microsoft Entra, moet Microsoft Entra Externe ID op de hoogte worden gesteld van de toepassing die u maakt. De app-registratie brengt een vertrouwensrelatie tot stand tussen de app en Microsoft Entra. Wanneer u een toepassing registreert, genereert externe id een unieke id die bekend staat als een toepassings-id (client), een waarde die wordt gebruikt om uw app te identificeren bij het maken van verificatieaanvragen.

De volgende stappen laten zien hoe u uw app registreert in het Microsoft Entra-beheercentrum:

1. Meld u als toepassingsontwikkelaar aan bij het Microsoft Entra-beheercentrum.

2. Als u toegang hebt tot meerdere tenants, gebruikt u het pictogram Instellingen in het bovenste menu om vanuit het menu Mappen en abonnementen over te schakelen naar uw externe tenant.

3. Blader naar identiteitstoepassingen>> App-registraties.

4. Selecteer + Nieuwe registratie.

5. Op de pagina Een toepassing registreren die wordt weergegeven;

   1. Voer een betekenisvolle toepassingsnaam in die wordt weergegeven aan gebruikers van de app, bijvoorbeeld ciam-client-app.
   2. Onder Ondersteunde accounttypen selecteert u Enkel accounts in deze organisatieadreslijst.

6. Selecteer Registreren.

7. Het deelvenster Overzicht van de toepassing wordt weergegeven bij een geslaagde registratie. Noteer de toepassings-id (client) die moet worden gebruikt in de broncode van uw toepassing.

Het platform en de URL's definiëren

Voer de volgende stappen uit om uw app-type op te geven voor uw app-registratie:

1. Selecteer Verificatie onder Beheren.
2. Selecteer op de pagina Platformconfiguraties de optie Een platform toevoegen en selecteer vervolgens de optie Web.
3. Voer voor de omleidings-URI's in https://localhost:7274/signin-oidc.
4. Voer onder afmeldings-URL voor front-channel de naam https://localhost:7274/signout-callback-oidc in voor afmelding.
5. Selecteer Configureren om uw wijzigingen op te slaan.

Impliciete en hybride stromen inschakelen

De toepassing die u bouwt, maakt gebruik van de impliciete stroom, die moet worden ingeschakeld.

1. Selecteer in de sectie Impliciete toekenning en hybride stromen de optie ID-tokens .
2. Selecteer Opslaan.

App-clientgeheim toevoegen

Maak vervolgens een clientgeheim voor de geregistreerde toepassing. De toepassing gebruikt het clientgeheim om de identiteit te bewijzen wanneer er tokens worden aangevraagd.

1. Selecteer op de pagina App-registraties de toepassing die u hebt gemaakt (zoals ciam-client-app) om de overzichtspagina te openen.
2. Selecteer onder Beheren de optie Certificaten en geheimen.
3. Selecteer Nieuw clientgeheim.
4. Voer in het vak Beschrijving een beschrijving in voor het clientgeheim (bijvoorbeeld ciam-app-clientgeheim).
5. Selecteer onder Verlopen een duur waarvoor het geheim geldig is (volgens de beveiligingsregels van uw organisatie) en selecteer vervolgens Toevoegen.
6. Noteer de Waarde van het geheim. U gebruikt deze waarde voor configuratie in een latere stap. De geheime waarde wordt niet opnieuw weergegeven en kan op geen enkele manier worden opgehaald nadat u weg navigeert van de certificaten en geheimen. Zorg ervoor dat u deze opneemt.

Beheerderstoestemming verlenen

1. Selecteer op de pagina App-registraties de toepassing die u hebt gemaakt (zoals ciam-client-app) om de overzichtspagina te openen.

2. Selecteer onder Beheren de optie API-machtigingen. In de lijst met geconfigureerde machtigingen is aan uw toepassing de machtiging User.Read toegewezen. Omdat de tenant echter een externe tenant is, kunnen de consumentengebruikers zelf geen toestemming geven voor deze machtiging. U als beheerder moet toestemming geven voor deze machtiging namens alle gebruikers in de tenant:

   1. Selecteer Beheerderstoestemming verlenen voor <uw tenantnaam> en selecteer Vervolgens Ja.
   2. Selecteer Vernieuwen en controleer vervolgens of Verleend voor <uw tenantnaam> wordt weergegeven onder Status voor beide bereiken.

Een gebruikersstroom maken

Volg deze stappen om een gebruikersstroom te maken die een klant kan gebruiken om zich aan te melden of zich te registreren voor een toepassing.

1. Meld u aan bij het Microsoft Entra-beheercentrum als ten minste een beheerder van de gebruikersstroom voor externe id's.

2. Als u toegang hebt tot meerdere tenants, gebruikt u het pictogram Instellingen in het bovenste menu om vanuit het menu Mappen en abonnementen over te schakelen naar uw externe tenant.

3. Blader naar gebruikersstromen> voor externe identiteiten.>

4. Selecteer + Nieuwe gebruikersstroom.

5. Op de pagina Maken :

   1. Voer een naam in voor de gebruikersstroom, zoals SignInSignUpSample.

   2. Selecteer E-mailaccounts in de lijst met id-providers. Met deze id-provider kunnen gebruikers zich aanmelden of registreren met hun e-mailadres.

      Notitie

      Aanvullende id-providers worden hier alleen vermeld nadat u federatie met hen hebt ingesteld. Als u bijvoorbeeld federatie met Google of Facebook instelt, kunt u deze extra id-providers hier selecteren.

   3. Onder E-mailaccounts kunt u een van de twee opties selecteren. Voor deze zelfstudie selecteert u E-mail met wachtwoord.

      • E-mail met wachtwoord: hiermee kunnen nieuwe gebruikers zich registreren en aanmelden met een e-mailadres als de aanmeldingsnaam en een wachtwoord als hun eerste factorreferentie.
      • Eenmalige wachtwoordcode per e-mail verzenden: hiermee kunnen nieuwe gebruikers zich registreren en aanmelden met behulp van een e-mailadres als de aanmeldingsnaam en eenmalige wachtwoordcode per e-mail als hun eerste factorreferentie. Wachtwoordcode voor eenmalige e-mail moet zijn ingeschakeld op tenantniveau (Alle id-providers>voor eenmalige wachtwoordcode) om deze optie beschikbaar te maken op gebruikersstroomniveau.

   4. Kies onder Gebruikerskenmerken de kenmerken die u wilt verzamelen van de gebruiker bij het aanmelden. Als u Meer weergeven selecteert, kunt u kenmerken en claims kiezen voor land/regio, weergavenaam en postcode. Selecteer OK. (Gebruikers worden alleen om kenmerken gevraagd wanneer ze zich voor het eerst registreren.)

6. Selecteer Maken. De nieuwe gebruikersstroom wordt weergegeven in de lijst gebruikersstromen . Vernieuw de pagina indien nodig.

Als u selfservice voor wachtwoordherstel wilt inschakelen, gebruikt u de stappen in het artikel Selfservice voor wachtwoordherstel inschakelen.

De webtoepassing koppelen aan de gebruikersstroom

Als de klantgebruikers de aanmeldings- of aanmeldingservaring willen zien wanneer ze uw app gebruiken, moet u uw app koppelen aan een gebruikersstroom. Hoewel veel toepassingen aan uw gebruikersstroom kunnen worden gekoppeld, kan één toepassing slechts worden gekoppeld aan één gebruikersstroom.

1. Selecteer Identiteit in het zijbalkmenu.

2. Selecteer Externe identiteiten en vervolgens Gebruikersstromen.

3. Selecteer op de pagina Gebruikersstromen de naam van de gebruikersstroom die u eerder hebt gemaakt, bijvoorbeeld SignInSignUpSample.

4. Selecteer Toepassingen onder Gebruiken.

5. Selecteer Toepassing toevoegen.

6. Selecteer de toepassing in de lijst, zoals ciam-client-app of gebruik het zoekvak om de toepassing te zoeken en selecteer deze.

7. Kies Selecteren.

Zodra u uw app aan een gebruikersstroom hebt gekoppeld, kunt u uw gebruikersstroom testen door de registratie- of aanmeldingservaring van een gebruiker te simuleren met uw toepassing vanuit het Microsoft Entra-beheercentrum. Gebruik hiervoor de stappen in De gebruikersstroom voor registreren en aanmelden testen.

Voorbeeldwebtoepassing klonen of downloaden

Als u de voorbeeldtoepassing wilt verkrijgen, kunt u deze klonen vanuit GitHub of downloaden als een .zip-bestand.

• Als u het voorbeeld wilt klonen, opent u een opdrachtprompt en navigeert u naar de locatie waar u het project wilt maken en voert u de volgende opdracht in:

  git clone https://github.com/Azure-Samples/ms-identity-ciam-dotnet-tutorial.git
  

• Download het .zip-bestand. Pak het uit naar een bestandspad waarbij de lengte van de naam minder dan 260 tekens is.

De toepassing configureren

1. Navigeer naar de hoofdmap van het voorbeeld dat u hebt gedownload en de map die de ASP.NET Core-voorbeeld-app bevat:

   cd 1-Authentication\1-sign-in-aspnet-core-mvc
   

2. Open het bestand appsettings.json.

3. Zoek en vervang deze in AuthorityEnter_the_Tenant_Subdomain_Here door het subdomein van uw tenant. Als uw primaire tenantdomein bijvoorbeeld is, is caseyjensen@onmicrosoft.comde waarde die u moet invoeren casyjensen.

4. Zoek de Enter_the_Application_Id_Here waarde en vervang deze door de toepassings-id (clientId) van de app die u hebt geregistreerd in het Microsoft Entra-beheercentrum.

5. Vervang Enter_the_Client_Secret_Here door de waarde van het clientgeheim die u hebt ingesteld in Clientgeheim toevoegen.

Het codevoorbeeld uitvoeren

1. Voer vanuit uw shell of opdrachtregel de volgende opdrachten uit:

   dotnet run
   

2. Open uw webbrowser en navigeer naar https://localhost:7274.

3. Meld u aan met een account dat is geregistreerd bij de externe tenant.

4. Nadat u zich hebt aangemeld, wordt de weergavenaam weergegeven naast de knop Afmelden , zoals wordt weergegeven in de volgende schermopname.

   

5. Als u zich wilt afmelden bij de toepassing, selecteert u de knop Afmelden .

Zie ook

• Gebruik onze meerdelige reeks zelfstudies om deze ASP.NET webtoepassing helemaal zelf te bouwen
• Wachtwoord opnieuw instellen inschakelen
• De standaard huisstijl aanpassen
• Aanmelden bij Google configureren
• Gebruikers aanmelden in uw eigen ASP.NET Core-webtoepassing met behulp van een externe tenant