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

Dit artikel gebruikt een voorbeeld van een Android-toepassing (Kotlin en Java) om aan te tonen hoe u de verificatie van Azure AD B2C (Azure Active Directory B2C) kunt toevoegen aan uw mobiele apps.

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 mobiele app maakt gebruik van de Microsoft Authentication Library (MSAL) met de OIDC-autorisatiecode PKCE-stroom. MSAL is een door Microsoft geleverde bibliotheek die het toevoegen van verificatie- en autorisatieondersteuning aan mobiele apps vereenvoudigt.

De aanmeldingsstroom omvat de volgende stappen:

  1. Gebruikers openen de app en selecteren aanmelding.
  2. De app opent de systeembrowser van het mobiele apparaat en start een verificatieaanvraag voor 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 autorisatiecode naar de app.
  5. De app voert de volgende acties uit:
    1. Hiermee worden de autorisatiecode voor een id-token, toegangstoken en vernieuwingstoken uitgewisseld.
    2. Het leest de id-tokenclaims.
    3. De tokens worden opgeslagen in een cache in het geheugen voor later gebruik.

Overzicht van app-registratie

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

  • Met de registratie van de mobiele app kan uw app zich aanmelden met Azure AD B2C. Tijdens de app-registratie geeft u de omleidings-URI op. De omleidings-URI is het eindpunt waarnaar gebruikers worden omgeleid door Azure AD B2C nadat ze zich met Azure AD B2C hebben geverifieerd. Het app-registratieproces genereert een toepassings-id, ook wel de 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 toepassings-id, waarmee uw web-API op unieke wijze wordt aangeduid (bijvoorbeeld app-id: 2). Verleen uw app (app-id: 1) machtigingen voor de web-API-bereiken (app-id: 2).

De app-registratie en toepassingsarchitectuur worden geïllustreerd in de volgende diagrammen:

Diagram of the mobile app with web API call registrations and tokens.

Aanroepen naar een web-API

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.

De afmeldingsstroom

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 tokencache.
  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.

Vereisten

Een computer met:

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: Mobiele apps registreren

Registreer de mobiele app en web-API-toepassing, en geef de bereiken van uw web-API op.

Stap 2.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 de Azure-portal.

  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.

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

Stap 2.2: Bereiken van een web-API-app configureren

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

  2. Selecteer onder BeherenEen 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 Bereiknaamtasks.read in.
    2. Voer voor Weergavenaam beheerderstoestemmingLeestoegang tot Tasks-API in.
    3. Voer voor Beschrijving beheerderstoestemmingStaat 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 Bereiknaamtasks.write in.
    2. Voer voor Weergavenaam beheerderstoestemmingSchrijftoegang tot Tasks-API in.
    3. Voer voor Beschrijving beheerderstoestemmingStaat schrijftoegang tot de Tasks-API toe in.
  8. Selecteer Bereik toevoegen.

Stap 2.3: De mobiele app registreren

Ga als volgt te werk om de registratie van de mobiele app te maken:

  1. Meld u aan bij de Azure-portal.

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

  3. Voer onder Naam een naam in voor de toepassing (bijvoorbeeld android-app1).

  4. Selecteer onder Ondersteunde accounttypen de optie Accounts in een identiteitsprovider of organisatiemap (voor het verifiëren van gebruikers met gebruikersstromen).

  5. Selecteer onder Omleidings-URI openbare client/systeemeigen (mobiel en desktop) en voer vervolgens in het URL-vak een van de volgende URI's in:

    • Voor het Kotlin-voorbeeld: msauth://com.azuresamples.msalandroidkotlinapp/1wIqXSqBj7w%2Bh11ZifsnqwgyKrY%3D
    • Voor het Java-voorbeeld: msauth://com.azuresamples.msalandroidapp/1wIqXSqBj7w%2Bh11ZifsnqwgyKrY%3D
  6. Selecteer Registreren.

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

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

    Screenshot highlighting the Android application ID

Stap 2.4: De machtigingen voor de mobiele app verlenen voor de web-API

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 Machtigingtaken 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.

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

Stap 3: Het voorbeeld van de mobiele Android-app ophalen

Voer een van de volgende bewerkingen uit:

  • Download een van deze voorbeelden:

    Pak het voorbeeldbestand in de .zip-indeling uit in uw werkmap.

  • Kloon de mobiele Android-voorbeeldtoepassing vanuit GitHub.

    git clone https://github.com/Azure-Samples/ms-identity-android-kotlin
    

Stap 4: De voorbeeld web-API configureren

Dit voorbeeld verkrijgt een toegangstoken met de relevante bereiken, die de mobiele app kan gebruiken voor een web-API. Ga als volgt te werk om een web-API aan te roepen vanuit code:

  1. Gebruik een bestaande web-API of maak een nieuwe. Zie Verificatie inschakelen in uw eigen web-API met behulp van Azure AD B2C voor meer informatie.
  2. Wijzig de voorbeeldcode om een web-API aan te roepen.

Stap 5: De voorbeeld mobiele app configureren

Open het voorbeeldproject met Android Studio of een andere code-editor. Open vervolgens het bestand /app/src/main/res/raw/auth_config_b2c.json.

Het configuratiebestand auth_config_b2c.json bevat informatie over uw Azure AD B2C-id-provider. De mobiele app gebruikt deze informatie om een vertrouwensrelatie tot stand te brengen met Azure AD B2C, gebruikers aan te melden en af te melden, tokens te verkrijgen en deze te valideren.

Werk de volgende eigenschappen van de app-instellingen bij:

Sleutel Waarde
client_id De id van de mobiele app uit stap 2.3.
redirect_uri De omleidings-URI van de mobiele app vanuit stap 2.3.
instanties De instantie is een URL die een map aangeeft waaruit de MSAL tokens kan aanvragen. Gebruik de volgende indeling: https://<your-tenant-name>.b2clogin.com/<your-tenant-name>.onmicrosoft.com/<your-sign-in-sign-up-policy>. Vervang <your-tenant-name> door uw Azure AD B2C-tenant-naam. Vervang vervolgens <your-sign-in-sign-up-policy> door de gebruikersstromen of het aangepaste beleid dat u in stap 1 hebt gemaakt.

Open de klasse B2CConfiguration, en werk de volgende klasseleden bij:

Sleutel Weergegeven als
Beleidsregels De lijst met gebruikersstromen of het aangepaste beleid dat u in stap 1 hebt gemaakt.
azureAdB2CHostName Het eerste deel van uw Azure AD B2C-tenantnaam (bijvoorbeeld https://contoso.b2clogin.com).
tenantName De volledige tenantnaam van uw Azure AD B2C-tenant (bijvoorbeeld contoso.onmicrosoft.com).
bereiken De web-API-bereiken die u in stap 2.4 hebt gemaakt.

Stap 6: de mobiele app uitvoeren en testen

  1. Maak het project en voer het uit.

  2. Selecteer linksboven het hamburgerpictogram (ook wel het samengevouwen menupictogram genoemd), zoals hier wordt weergegeven:

    Screenshot highlighting the hamburger, or collapsed menu, icon.

  3. Selecteer B2C-modus in het linkerdeelvenster.

    Screenshot highlighting the

  4. Selecteer Gebruikersstroom uitvoeren.

    Screenshot highlighting the

  5. Registreer u of meld u aan met uw lokaal of sociale account van Azure AD B2C.

  6. Als de verificatie is geslaagd, staat uw weergavenaam in het deelvenster B2C-modus.

    Screenshot showing a successful authentication, with signed-in user and policy displayed.

Volgende stappen

Leer hoe u het volgende doet: