Konfigurera autentisering i en Python-exempelwebbapp med hjälp av Azure AD B2C

Den här artikeln använder ett Python-exempelwebbprogram för att illustrera hur du lägger till Azure Active Directory B2C-autentisering (Azure AD B2C) i dina webbprogram.

Översikt

OpenID Anslut (OIDC) är ett autentiseringsprotokoll som bygger på OAuth 2.0. Du kan använda OIDC för att logga in användare på ett säkert sätt i ett program. Det här webbappexemplet använder identitetspaketet för Python för att förenkla tillägg av stöd för autentisering och auktorisering i Python-webbappar.

Inloggningsflödet omfattar följande steg:

  1. Användare går till webbappen och väljer Logga in.
  2. Appen initierar en autentiseringsbegäran och omdirigerar användare till Azure AD B2C.
  3. Användare registrerar sig eller loggar in, återställer lösenordet eller loggar in med ett socialt konto.
  4. När användarna har loggat in returnerar Azure AD B2C en ID-token till appen.
  5. Appen utbyter auktoriseringskoden med en ID-token, validerar ID-token, läser anspråken och returnerar sedan en säker sida till användarna.

Förutsättningar

Steg 1: Konfigurera användarflödet

När användare försöker logga in på din app startar appen en autentiseringsbegäran till auktoriseringsslutpunkten via ett användarflöde. Användarflödet definierar och styr användarupplevelsen. När användarna har slutfört användarflödet genererar Azure AD B2C en token och omdirigerar sedan användarna tillbaka till ditt program.

Om du inte redan har gjort det skapar du ett användarflöde eller en anpassad princip. Upprepa stegen för att skapa tre separata användarflöden på följande sätt:

  • Ett kombinerat användarflöde för inloggning och registrering , till exempel susi. Det här användarflödet stöder även funktionen För att glömma ditt lösenord .
  • Ett användarflöde för profilredigering , till exempel edit_profile.
  • Ett användarflöde för lösenordsåterställning , till exempel reset_password.

Azure AD B2C förbereder användarflödesnamnet B2C_1_ . Till exempel kommer susi att bli B2C_1_susi.

Steg 2: Registrera ett webbprogram

Om du vill göra det möjligt för ditt program att logga in med Azure AD B2C registrerar du din app i katalogen Azure AD B2C. När du registrerar din app upprättas en förtroenderelation mellan appen och Azure AD B2C.

Under appregistreringen anger du omdirigerings-URI:n. Omdirigerings-URI:n är slutpunkten som användarna omdirigeras till av Azure AD B2C när de har autentiserats med Azure AD B2C. Appregistreringsprocessen genererar ett program-ID, även kallat klient-ID, som unikt identifierar din app. När appen har registrerats använder Azure AD B2C både program-ID:t och omdirigerings-URI:n för att skapa autentiseringsbegäranden.

Steg 2.1: Registrera appen

Följ dessa steg för att skapa webbappregistreringen:

  1. Logga in på Azure-portalen.

  2. Om du har åtkomst till flera klienter väljer du ikonen Inställningar på den översta menyn för att växla till din Azure AD B2C-klient från menyn Kataloger + prenumerationer.

  3. I Azure-portalen söker du efter och väljer Azure AD B2C.

  4. Välj Appregistreringar och välj sedan Ny registrering.

  5. Under Namn anger du ett namn för programmet (till exempel webapp1).

  6. Under Kontotyper som stöds, välj Konton i valfri identitetsleverantör eller organisationskatalog (för autentisering av användare med användarflöden).

  7. Under Omdirigerings-URI väljer du Webb och i rutan URL anger du http://localhost:5000/getATokensedan .

  8. Under Behörigheter väljer du kryssrutan Bevilja administratörsmedgivande till openid- och offlineåtkomstbehörigheter .

  9. Välj Registrera.

  10. Välj Översikt.

  11. Registrera program-ID :t (klient) för senare användning när du konfigurerar webbprogrammet.

    Screenshot of the web app Overview page for recording your web app I D.

Steg 2.2: Skapa en webbappsklienthemlighet

Skapa en klienthemlighet för det registrerade webbprogrammet. Webbprogrammet använder klienthemligheten för att bevisa sin identitet när den begär token.

  1. Under Hantera väljer du Certifikat och hemligheter.
  2. Välj Ny klienthemlighet.
  3. I rutan Beskrivning anger du en beskrivning av klienthemligheten (till exempel clientsecret1).
  4. Under Upphör att gälla väljer du en varaktighet för vilken hemligheten är giltig och väljer sedan Lägg till.
  5. Registrera hemlighetens värde. Du använder det här värdet för konfiguration i ett senare steg.

Steg 3: Hämta webbappexemplet

Ladda ned zip-filen eller klona exempelwebbprogrammet från GitHub.

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

Extrahera exempelfilen till en mapp där sökvägens totala längd är 260 eller färre tecken.

Steg 4: Konfigurera exempelwebbappen

Följ dessa steg i projektets rotkatalog:

  1. Skapa en .env fil i rotmappen för projektet med hjälp av .env.sample som en guide.

    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
    
    Tangent Värde
    B2C_TENANT_NAME Den första delen av ditt Azure AD B2C-klientnamn (till exempel contoso).
    CLIENT_ID Webb-API-program-ID från steg 2.1.
    CLIENT_SECRET Det klienthemlighetsvärde som du skapade i steg 2.2.
    *_USER_FLOW Användarflödena som du skapade i steg 1.

    Miljövariablerna refereras i app_config.py och lagras i en separat .env-fil för att hålla dem borta från källkontrollen. Den angivna .gitignore-filen förhindrar att .env-filen checkas in.

Steg 5: Kör exempelwebbappen

  1. I konsolen eller terminalen växlar du till katalogen som innehåller exemplet. Till exempel:

    cd ms-identity-python-webapp
    
  2. Installera de paket som krävs från PyPi och kör webbappen på den lokala datorn genom att köra följande kommandon:

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

    Konsolfönstret visar portnumret för det lokalt körda programmet:

     * 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. Om du vill visa webbprogrammet som körs på den lokala datorn går du till http://localhost:5000.

  4. Välj Logga in.

    Screenshot showing the sign-in flow.

  5. Slutför registreringen eller inloggningsprocessen.

  6. Efter lyckad autentisering visas visningsnamnet, som du ser här:

    Screenshot showing the web app token's display name claim.

Steg 6: Anropa ett webb-API

Om du vill att din app ska kunna logga in med Azure AD B2C och anropa ett webb-API måste du registrera två program i Azure AD B2C-katalogen.

  • Den webbappsregistrering (Python) som du redan skapade i steg 2. Med den här appregistreringen kan din app logga in med Azure AD B2C. Appregistreringsprocessen genererar ett program-ID, även kallat klient-ID, som unikt identifierar din app. Till exempel app-ID: 1.

  • Med registreringen av webb-API :et kan din app anropa ett skyddat webb-API. Registreringen exponerar webb-API-behörigheter (omfång). Appregistreringsprocessen genererar ett program-ID som unikt identifierar ditt webb-API (till exempel app-ID: 2). Ge din app (app-ID: 1) behörighet till webb-API-omfången (app-ID: 2).

Appregistreringarna och programarkitekturen beskrivs i följande diagram:

Diagram describing a web app with web API, registrations, and tokens.

När autentiseringen har slutförts interagerar användarna med appen, som anropar ett skyddat webb-API. Webb-API:et använder ägartokenautentisering . Ägartoken är den åtkomsttoken som appen fick från Azure AD B2C. Appen skickar token i auktoriseringshuvudet för HTTPS-begäran.

Authorization: Bearer <access token>

Om åtkomsttokens omfång inte matchar webb-API:ets omfång hämtar autentiseringsbiblioteket en ny åtkomsttoken med rätt omfång.

Steg 6.1: Registrera webb-API-appen

Så här skapar du appregistreringen för webb-API:et (app-ID: 2):

  1. Logga in på Azure-portalen.

  2. Kontrollera att du använder katalogen som innehåller din Azure AD B2C-klientorganisation. Välj ikonen Kataloger + prenumerationer i portalens verktygsfält.

  3. I portalinställningarna | Sidan Kataloger + prenumerationer, leta upp din Azure AD B2C-katalog i listan Katalognamn och välj sedan Växla.

  4. I Azure-portalen söker du efter och väljer Azure AD B2C.

  5. Välj Appregistreringar och välj sedan Ny registrering.

  6. Som Namn anger du ett namn för programmet (till exempel my-api1). Lämna standardvärdena för omdirigerings-URI och kontotyper som stöds.

  7. Välj Registrera.

  8. När appregistreringen är klar väljer du Översikt.

  9. Registrera program-ID-värdet (klient) för senare användning när du konfigurerar webbprogrammet.

    Screenshot that demonstrates how to get a web A P I application I D.

Steg 6.2: Konfigurera omfång

  1. Välj det my-api1-program som du skapade (app-ID: 2) för att öppna sidan Översikt .

  2. Under Hantera väljer du Exponera ett API.

  3. Bredvid Program-ID-URI väljer du länken Ange. Ersätt standardvärdet (GUID) med ett unikt namn (till exempel tasks-api) och välj sedan Spara.

    När ditt webbprogram begär en åtkomsttoken för webb-API:et bör den lägga till den här URI:n som prefix för varje omfång som du definierar för API:et.

  4. Under Omfång som definieras av det här API:et väljer du Lägg till ett omfång.

  5. Så här skapar du ett omfång som definierar läsåtkomst till API:et:

    1. Ange tasks.read som Omfångsnamn.
    2. För Visningsnamn för administratörsmedgivande anger du Läs åtkomst till uppgifters API.
    3. För Beskrivning av administratörsmedgivande anger du Tillåt läsåtkomst till aktivitets-API:et.
  6. Välj Lägg till definitionsområde.

  7. Välj Lägg till ett omfång och lägg sedan till ett omfång som definierar skrivåtkomst till API:et:

    1. Ange tasks.write som Omfångsnamn.
    2. För Visningsnamn för administratörsmedgivande anger du Skrivåtkomst till aktivitets-API.
    3. För Beskrivning av administratörsmedgivande anger du Tillåt skrivåtkomst till aktivitets-API:et.
  8. Välj Lägg till definitionsområde.

Steg 6.3: Bevilja webbappen behörigheter

Följ dessa steg för att ge din app (app-ID: 1) behörighet:

  1. Välj Appregistreringar och välj sedan den app som du skapade (app-ID: 1).

  2. Under Hantera väljer du API-behörigheter.

  3. Under Konfigurerade behörigheter väljer du Lägg till en behörighet.

  4. Välj fliken Mina API:er .

  5. Välj det API (app-ID: 2) som webbprogrammet ska beviljas åtkomst till. Ange till exempel my-api1.

  6. Under Behörighet expanderar du aktiviteter och väljer sedan de omfång som du definierade tidigare (till exempel tasks.read och tasks.write).

  7. Välj Lägg till behörigheter.

  8. Välj Bevilja administratörsmedgivande för< ditt klientnamn>.

  9. Välj Ja.

  10. Välj Uppdatera och kontrollera sedan att Beviljad för ... visas under Status för båda omfången.

  11. I listan Konfigurerade behörigheter väljer du ditt omfång och kopierar sedan det fullständiga omfångsnamnet.

    Screenshot of the configured permissions pane, showing that read access permissions are granted.

Steg 6.4: Konfigurera webb-API:et

Det här exemplet hämtar en åtkomsttoken med relevanta omfång som webbappen kan använda för ett webb-API. Det här exemplet fungerar inte som ett webb-API. I stället måste du använda ett befintligt webb-API eller skapa ett nytt. En självstudiekurs om hur du skapar ett webb-API i din B2C-klient finns i Aktivera autentisering i ditt eget webb-API med hjälp av Azure AD B2C.

Steg 6.5: Konfigurera exempelappen med webb-API:et

Öppna filen app_config.py. Den här filen innehåller information om din Azure AD B2C-identitetsprovider. Uppdatera följande egenskaper för appinställningarna:

Tangent Värde
ENDPOINT URI:n för ditt webb-API (till exempel https://localhost:6000/hello).
SCOPE Webb-API :ets omfång som du skapade (till exempel ["https://contoso.onmicrosoft.com/tasks-api/tasks.read", https://contoso.onmicrosoft.com/tasks-api/tasks.write"]).

Steg 6.6: Kör exempelappen

  1. I konsolen eller terminalen växlar du till katalogen som innehåller exemplet.

  2. Om appen inte fortfarande körs startar du om den med kommandot från steg 5.

  3. Välj Anropa ett underordnat API.

    Screenshot showing how to call a web API.

Steg 7: Distribuera ditt program

I ett produktionsprogram är omdirigerings-URI:n för appregistrering vanligtvis en offentligt tillgänglig slutpunkt där appen körs, till exempel https://contoso.com/getAToken.

Du kan lägga till och ändra omdirigerings-URI:er i dina registrerade program när som helst. Följande begränsningar gäller för omdirigerings-URI:er:

  • Omdirigerings-URL:en måste börja med schemat https.
  • Omdirigerings-URL:en är skiftlägeskänslig. Ärendet måste matcha fallet med URL-sökvägen för ditt program som körs.

Nästa steg