Verificatie configureren in een voorbeeld van een Python-webtoepassing met behulp van Azure AD B2C

In dit artikel wordt een voorbeeld van een Python-webtoepassing gebruikt om te laten zien hoe u verificatie van Azure Active Directory B2C (Azure AD B2C) aan uw webtoepassingen kunt toevoegen.

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. In dit voorbeeld van een web-app wordt het identiteitspakket voor Python gebruikt om het toevoegen van verificatie- en autorisatieondersteuning aan Python-web-apps te 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 of melden zich aan, het wachtwoord opnieuw instellen of zich aanmelden met een sociaal account.
4. Nadat gebruikers zich hebben aangemeld, retourneert Azure AD B2C een id-token naar de app.
5. De app wisselt de autorisatiecode uit met een id-token, valideert het id-token, leest de claims en retourneert vervolgens een beveiligde pagina aan gebruikers.

Vereisten

• Een Azure-account met een actief abonnement. Gratis een account maken
• Als u er nog geen hebt, maakt u een Azure AD B2C-tenant die is gekoppeld aan uw Azure-abonnement.
• Python 3.8+

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_ vóór de naam van de gebruikersstroom toe. Zo wordt susi gewijzigd in 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. Door uw toepassing te registreren, wordt een vertrouwensrelatie tot stand gebracht tussen de toepassing 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 app-registratieproces 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.

Stap 2.1: De app registreren

Volg deze stappen om de web-app te registreren:

1. Meld u aan bij het Azure-portaal.

2. Als u toegang hebt tot meerdere tenants, selecteert u het pictogram Instellingen in het bovenste menu om over te schakelen naar uw Azure AD B2C-tenant in het menu Mappen en 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 accounttypen de optie Accounts in een identiteitsprovider of organisatiemap (voor het verifiëren van gebruikers met gebruikersstromen).

7. Selecteer onder Omleidings-URI de optie Web en voer vervolgens in het vak URL http://localhost:5000/getAToken in.

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

9. Selecteer Registreren.

10. Selecteer Overzicht.

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

    

Stap 2.2: Een web-app-clientgeheim maken

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

1. Selecteer onder Beheren de optie Certificaten en geheimen.
2. Selecteer Nieuw clientgeheim.
3. Voer in het vak Beschrijving een beschrijving in voor het clientgeheim (bijvoorbeeld clientsecret1).
4. Selecteer onder Verloopt een duur waarvoor het geheim geldig is en selecteer vervolgens Toevoegen.
5. Noteer de Waarde van het geheim. U gebruikt deze waarde voor configuratie in een latere stap.

Stap 3: Het voorbeeld van de webtoepassing ophalen

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

git clone https://github.com/Azure-Samples/ms-identity-python-webapp.git

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

Stap 4: De voorbeeldwebtoepassing configureren

Voer in de hoofdmap van het project de volgende stappen uit:

1. Maak een .env bestand in de hoofdmap van het project met behulp van .env.sample een handleiding.

   FLASK_DEBUG=True
   B2C_TENANT_NAME=<tenant name>
   CLIENT_ID=<client id>
   CLIENT_SECRET=<client secret>
   SIGNUPSIGNIN_USER_FLOW=B2C_1_signupsignin1
   EDITPROFILE_USER_FLOW=B2C_1_profile_editing
   RESETPASSWORD_USER_FLOW=B2C_1_reset_password
   

   Sleutel	Weergegeven als
   B2C_TENANT_NAME	Het eerste deel van uw Azure AD B2C-tenantnaam (bijvoorbeeld contoso).
   CLIENT_ID	De web-API-toepassings-id uit stap 2.1.
   CLIENT_SECRET	De waarde voor het clientgeheim die u in stap 2.2 hebt gemaakt.
   *_USER_FLOW	De gebruikersstromen die u in stap 1 hebt gemaakt.

   Naar de omgevingsvariabelen wordt verwezen in app_config.py en worden bewaard in een afzonderlijk .env-bestand om ze buiten broncodebeheer te houden. Het opgegeven .gitignore-bestand voorkomt dat het .env-bestand wordt ingecheckt.

Stap 5:De voorbeeld-webtoepassing uitvoeren

1. Ga in de console of terminal naar de map met het voorbeeld. Voorbeeld:

   cd ms-identity-python-webapp
   

2. Installeer de vereiste pakketten van PyPi en voer de web-app uit op uw lokale computer door de volgende opdrachten uit te voeren:

   Linux

   python -m pip install -r requirements.txt
   python -m flask run --host localhost --port 5000
   

   MacOS

   python -m pip install -r requirements.txt
   python -m flask run --host localhost --port 5000
   

   Windows

   py -m pip install -r requirements.txt
   py -m flask run --host localhost --port 5000
   

   In het consolevenster wordt het poortnummer van de lokaal uitgevoerde toepassing weergegeven:

    * Debug mode: on
      WARNING: This is a development server. Do not use it in a production deployment.
      Use a production WSGI server instead.
    * Running on `http://localhost:5000/` (Press CTRL+C to quit)
   

3. Als u de webtoepassing wilt bekijken die op uw lokale machine wordt uitgevoerd, gaat u naar http://localhost:5000.

4. Selecteer Aanmelden.

   

5. Voltooi het aanmeldings- of registratieproces.

6. Als de verificatie is geslaagd, wordt uw weergavenaam weergegeven, zoals hier kunt zien:

   

Stap 6: Een web-API aanroepen

Als u wilt dat de app zich kan aanmelden met Azure AD B2C en een web-API kan aanroepen, moet u twee toepassingen registreren in de Azure AD B2C-directory.

• De registratie van de webtoepassing (Python) die al in Stap 2 hebt gemaakt. Met deze app-registratie kan uw app zich aanmelden met Azure AD B2C. Het app-registratieproces genereert een toepassings-id, ook wel client-id genoemd, waarmee uw toepassing op unieke wijze wordt aangeduid. Bijvoorbeeld app-id: 1.

• Met de registratie van een web-API kan de app een beveiligde web-API aanroepen. De registratie maakt de web-API-machtigingen (bereiken) beschikbaar. Het app-registratieproces genereert een unieke toepassings-id voor uw web-API (bijvoorbeeld app-id: 2). Ken aan uw app (app-id: 1) machtigingen toe voor de web-API-bereiken (app-id: 2).

De app-registraties en de toepassingsarchitectuur worden beschreven in het volgende diagram:

Nadat de verificatie is voltooid, communiceren gebruikers met de app, die een beveiligde web-API aanroept. De web-API maakt gebruik van verificatie via een Bearer-token. Het Bearer-token is het toegangstoken dat de app van Azure AD B2C heeft gekregen. De app geeft het token door in de autorisatieheader van de HTTPS-aanvraag.

Authorization: Bearer <access token>

Als het bereik van het toegangstoken niet overeenkomt met de bereiken van de web-API, verkrijgt de verificatiebibliotheek een nieuw toegangstoken met de juiste bereiken.

Stap 6.1: web-API-app registreren

Voer de volgende stappen uit om de web-API-app (app-id: 2) te registreren:

1. Meld u aan bij het Azure-portaal.

2. Zorg ervoor dat u de map gebruikt die uw Azure AD B2C-tenant bevat. Selecteer op de portalwerkbalk het pictogram Mappen + abonnementen.

3. Ga op de pagina Portalinstellingen | Directory's en abonnementen naar uw Azure AD B2C-directory in de lijst Mapnaam en selecteer vervolgens Omzetten.

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

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

6. Voer bij Naam een naam in voor de toepassing (bijvoorbeeld my-api1). Laat de standaardwaarden voor omleidings-URI en ondersteunde accounttypen staan.

7. Selecteer Registreren.

8. Nadat de app-registratie is voltooid, selecteert u Overzicht.

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

   

Stap 6.2. Bereiken configureren

1. Selecteer de my-api1-toepassing die u hebt gemaakt (app-id: 2) om de overzichtspagina te openen.

2. Selecteer onder Beheren Een API beschikbaar maken.

3. Selecteer naast URI voor de toepassings-id de link Instellen. Vervang de standaardwaarde (GUID) door een unieke naam (bijvoorbeeld tasks-api) en selecteer Opslaan.

   Wanneer uw webtoepassing een toegangstoken voor de web-API aanvraagt, moet deze URI als voorvoegsel worden toegevoegd voor elk bereik dat u voor de API definieert.

4. Onder Bereiken die door deze API worden bepaald selecteert u Een bereik toevoegen.

5. Een bereik maken dat de leestoegang tot de API definieert:

   1. Voer voor Bereiknaam tasks.read in.
   2. Voer voor Weergavenaam beheerderstoestemming Leestoegang tot Tasks-API in.
   3. Voer voor Beschrijving beheerderstoestemming Staat leestoegang toegang tot de Tasks-API toe in.

6. Selecteer Bereik toevoegen.

7. Selecteer Bereik toevoegen en voeg vervolgens een bereik toe dat de schrijftoegang tot de API definieert:

   1. Voer voor Bereiknaam tasks.write in.
   2. Voer voor Weergavenaam beheerderstoestemming Schrijftoegang tot Tasks-API in.
   3. Voer voor Beschrijving beheerderstoestemming Staat schrijftoegang tot de Tasks-API toe in.

8. Selecteer Bereik toevoegen.

Stap 6.3: De machtigingen voor de web-app verlenen

Voer de volgende stappen uit om uw app (app-id: 1) machtigingen te verlenen:

1. Selecteer App-registraties en selecteer vervolgens de app die u hebt gemaakt (App-id: 1).

2. Selecteer onder Beheren de optie API-machtigingen.

3. Selecteer onder Geconfigureerde machtigingen de optie Een machtiging toevoegen.

4. Selecteer het tabblad Mijn API's.

5. Selecteer de API (App-id: 2) waarvoor aan de webclienttoepassing toegang moet worden verleend. Voer bijvoorbeeld my-api1 in.

6. Vouw onder Machtiging taken uit en selecteer vervolgens de bereiken die u eerder hebt gedefinieerd (bijvoorbeeld tasks.read en tasks.write).

7. Selecteer Machtigingen toevoegen.

8. Selecteer Beheerderstoestemming verlenen voor <uw tenantnaam>.

9. Selecteer Ja.

10. Selecteer Vernieuwen en controleer vervolgens of voor beide bereiken Verleend voor... wordt weergegeven onder Status.

11. Selecteer uw bereik in de lijst geconfigureerde machtigingen en kopieer vervolgens de volledige naam van het bereik.

    

Stap 6.4: Uw code configureren

Dit voorbeeld verkrijgt een toegangstoken met de relevante bereiken, die de web-app kan gebruiken voor een web-API. Dit voorbeeld zelf fungeert niet als een web-API. In plaats daarvan moet u een bestaande web-API gebruiken of een nieuwe maken. Zie Verificatie in uw eigen web-API inschakelen met behulp van Azure AD B2C voor een zelfstudie over het maken van een web-API in uw B2C-tenant.

Stap 6.5: De voorbeeld-app configureren met de web-API

Open het bestand app_config.py. Het bestand bevat informatie over uw Azure AD B2C-id-provider. Werk de volgende eigenschappen van de app-instellingen bij:

Sleutel	Weergegeven als
ENDPOINT	De URI van uw web-API (bijvoorbeeld https://localhost:6000/hello).
SCOPE	De web-API-bereiken die u hebt gemaakt (bijvoorbeeld["https://contoso.onmicrosoft.com/tasks-api/tasks.read", https://contoso.onmicrosoft.com/tasks-api/tasks.write"]).

Stap 6.6: De voorbeeld-app uitvoeren

1. Ga in de console of terminal naar de map met het voorbeeld.

2. Als de app nog steeds niet wordt uitgevoerd, start u deze opnieuw met behulp van de opdracht uit stap 5.

3. Selecteer Een downstream-API aanroepen.

   

Stap 7: 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/getAToken.

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 omleidings-URL moet beginnen met het schema https.
• De omleidings-URL is hoofdlettergevoelig. Het hoofdlettergebruik moet overeenkomen met het URL-pad van de actieve toepassing.

Volgende stappen

• Meer informatie over het configureren van verificatieopties in een Python-web-app met behulp van Azure AD B2C.