Gebruikers afmelden

Voordat u hier begint, moet u weten hoe u zich aanmeldt, tokens verkrijgt en de levensduur van tokens beheert.

Afmelden

Het afmeldproces voor MSAL bestaat uit twee stappen.

1. Wis de MSAL-cache.
2. Wis de sessie op de identiteitsserver.

Het PublicClientApplication object bevat twee API's die deze acties uitvoeren.

msalInstance.logoutRedirect();
msalInstance.logoutPopup();

Met deze API's wordt de tokencache van alle gebruikers- en sessiegegevens gewist en navigeert u vervolgens in het browservenster of pop-upvenster naar de afmeldingspagina van de server. De server vraagt de gebruiker vervolgens om het account te selecteren waarvan hij of zij zich wil afmelden en terug te leiden naar uw postLogoutRedirectUri zolang aan de volgende voorwaarden wordt voldaan:

1. De URI is geregistreerd als antwoord-URL voor de app-registratie
2. De URI wordt opgegeven in de postLogoutRedirectUri van de PublicClientApplication-configuratie of in de afmeldingsaanvraag
3. De gebruiker heeft een actieve sessie met de id-provider
4. (MSA-scenario’s) Een afmeldings-URL voor het frontkanaal is geconfigureerd in de app-registratie

Als aan een van de bovenstaande voorwaarden niet wordt voldaan, blijft de pagina (of het pop-upvenster) aanwezig op de afmeldingspagina van de id-provider.

BELANGRIJK: Als deze afmeldingsnavigatie op welke manier dan ook wordt onderbroken, kan uw MSAL-cache worden gewist, maar de sessie kan nog steeds op de server blijven bestaan. Zorg ervoor dat de navigatie volledig is voltooid voordat u terugkeert naar uw toepassing.

const msalConfig = {
    auth: {
        clientId: 'your_client_id',
        authority: 'https://login.microsoftonline.con/{your_tenant_id}',
        redirectUri: 'https://contoso.com',
        postLogoutRedirectUri: 'https://contoso.com/homepage'
    }
};

Objecten aanvragen

Configuratieopties kunnen worden verstrekt aan elk van de afmeldings-API's om het gedrag aan te passen:

• logoutRedirect-aanvraag
• afmeldingsaanvraag

afmeldOmleiding

Bij gebruik van logoutRedirect wordt de lokale cache van gebruikerstokens gewist en wordt het venster vervolgens omgeleid naar de afmeldpagina van de server. De door logoutRedirect geretourneerde promise zal naar verwachting niet worden afgehandeld, maar u kunt erop wachten als u moet voorkomen dat andere code wordt uitgevoerd voordat de omleiding wordt gestart.

Configuratieopties kunnen worden opgegeven om het gedrag aan te passen:

const currentAccount = msalInstance.getAccount({ homeAccountId });
await msalInstance.logoutRedirect({
    account: currentAccount,
    postLogoutRedirectUri: "https://contoso.com/loggedOut"
});

Afmelden van de server overslaan

Als u wilt dat uw toepassing alleen lokaal afmeldt, kunt u voor de parameter onRedirectNavigate in het verzoek een callback opgeven en die callback `false` laten retourneren.

msalInstance.logoutRedirect({
    onRedirectNavigate: (url) => {
        // Return false if you would like to stop navigation after local logout
        return false;
    }
});

afmeldpop-up

De logoutPopup API opent de aanmeldingspagina van de server in een pop-up, zodat uw toepassing de huidige status kan behouden. Hierdoor zijn er enkele aanvullende overwegingen bij de keuze logoutRedirect om pop-ups te gebruiken om uit te loggen:

• De door logoutPopup geretourneerde promise wordt naar verwachting voltooid nadat de pop-up is gesloten
• postLogoutRedirectUri is vereist opdat MSAL de pop-up kan sluiten wanneer het afmelden is voltooid
• postLogoutRedirectUri wordt geopend in het pop-upvenster, niet in het hoofdframe. Als u wilt dat uw app op het hoogste niveau na afmelding wordt omgeleid, kunt u de mainWindowRedirectUri parameter in de afmeldingsaanvraag gebruiken.

Configuratieopties kunnen worden opgegeven om het gedrag aan te passen.

const currentAccount = msalInstance.getAccount({ homeAccountId });
await msalInstance.logoutPopup({
    account: currentAccount,
    postLogoutRedirectUri: "https://contoso.com/loggedOut",
    mainWindowRedirectUri: "https://contoso.com/homePage",
    popupWindowAttributes: {
        popupSize: {
            height: 100,
            width: 100
        },
        popupPosition: {
            top: 100,
            left: 100
        }
    }
});

Promptloze afmelding

Als voor uw clienttoepassing de optionele claim login_hint is ingeschakeld voor ID-tokens, kunt u de claim login_hint van het ID-token gebruiken om een 'stille' afmelding of afmelding zonder prompt uit te voeren bij het gebruik van logoutRedirect of logoutPopup. Er zijn twee manieren om een promptloze afmelding te bereiken:

Optie 1: MSAL automatisch de login_hint van de id-tokenclaims van het account laten parseren

De eerste en eenvoudigste optie is het opgeven van het accountobject dat u wilt beëindigen van de sessie voor de afmeldings-API. MSAL controleert of de login_hint-claim aanwezig is in het ID-token van het account en voegt deze automatisch als logout_hint toe aan de afmeldingsaanvraag om de accountkiezerprompt over te slaan.

const currentAccount = msalInstance.getAccount({ homeAccountId });
// The account's ID Token must contain the login_hint optional claim to avoid the account picker
await msalInstance.logoutRedirect({ account: currentAccount});

Optie 2: De optie logoutHint handmatig instellen in de afmeldingsaanvraag

Als alternatief, als u de claim logoutHint liever handmatig instelt, kunt u de claim login_hint in uw app extraheren en deze instellen als de logoutHint in de afmeldingsaanvraag:

const currentAccount = msalInstance.getAccount({ homeAccountId });

// Extract login hint to use as logout hint
const logoutHint = currentAccount.idTokenClaims.login_hint;
await msalInstance.logoutPopup({ logoutHint: logoutHint });

Opmerking: afhankelijk van de API die u kiest (omleiding/pop-up), wordt de app nog steeds omgeleid of wordt er een pop-up geopend om de serversessie te beëindigen. Het verschil is dat de gebruiker de prompt voor accountkiezer van de server niet ziet of moet gebruiken.

Afmelden via front-channel

Microsoft Entra ID en Azure AD B2C ondersteunen de OAuth-front-channel-afmeldingsfunctie, waarmee eenmalig afmelden mogelijk is in alle applicaties wanneer een gebruiker zich afmeldt. Voer de volgende stappen uit om te profiteren van deze functie met MSAL.js:

1. Maak in uw toepassing een speciale afmeldingspagina. Op deze pagina mag geen andere functie worden uitgevoerd, zoals het verkrijgen van tokens bij het laden van pagina's (zie hieronder voor meer informatie). Opmerking: deze pagina wordt geladen in een verborgen iframe en voor Microsoft Entra ID- en MSA-gebruikers worden de iss en sid queryparameters opgenomen.
2. Ga in het Microsoft Entra-beheercentrum naar de pagina Authenticatie voor uw toepassing en registreer de pagina van stap één onder Front-channel-afmeldings-URL. Opmerking: deze pagina moet worden geladen via https.

Vereisten voor front-channel afmeldingspagina

De pagina die wordt gebruikt voor afmelding voor het frontkanaal, moet als volgt worden gebouwd:

1. Bij het laden van pagina's wordt de MSAL-API logoutRedirect automatisch aangeroepen.
2. Stel in de PublicClientApplication-configuratie system.allowRedirectInIframe in op true.
3. Wanneer u aanroept logout, raden we u aan om de omleiding in het iframe naar de afmeldingspagina te voorkomen (zie hierboven).

Voorbeeld:

const msal = new PublicClientApplication({
    auth: {
        clientId: "my-client-id"
    },
    system: {
        allowRedirectInIframe: true
    }
})

// Automatically on page load
msal.logoutRedirect({
    onRedirectNavigate: () => {
        // Return false to stop navigation after local logout
        return false;
    }
});

Wanneer een gebruiker zich afmeldt bij een andere toepassing, wordt de afmeldings-URL van uw toepassing in een verborgen iframe geladen en wordt MSAL.js de cache gewist om eenmalige afmelding te voltooien.

Voorbeelden van front-channel-logout

De volgende voorbeelden laten zien hoe u front-channel afmelding implementeert met behulp van MSAL.js:

• MSAL Angular v2: Angular 11-voorbeeld
• MSAL React: React Router-voorbeeld

Gebeurtenissen

Als verschillende onderdelen van uw app moeten reageren op afmeldingsstatus zonder directe toegang tot de belofte die wordt geretourneerd door logoutRedirect of logoutPopup u kunt de gebeurtenis-API gebruiken.

Er worden gebeurtenissen geactiveerd wanneer het afmelden slaagt of mislukt en wanneer de pop-up wordt geopend bij het gebruik van logoutPopup.

Belangrijke opmerkingen

• Als er geen account wordt meegegeven aan de logout-API, of als er geen EndSessionRequest-object wordt meegegeven, worden alle accounts afgemeld.
• Als een account wordt doorgegeven aan de afmeld-API, wist MSAL alleen tokens die aan dat account zijn gekoppeld.
• Het afmelden van servers is een handige functie en wordt als zodanig uitgevoerd met de beste inspanning. Afmeldings-API's worden succesvol voltooid mits de lokale applicatiecache met succes is leeggemaakt, ongeacht of de afmelding bij de server wel of niet is geslaagd.

Volgende stappen

Ga dieper in op geavanceerdere onderwerpen, zoals:

• In het geheugen opslaan
• Geavanceerde configuratieopties