Single-page applications kunnen een client secret niet veilig in de browser bewaren. Gebruik de authorization code flow met PKCE, of het officiële pakket @intastellar/signin-sdk-react als je React als doel hebt en je client daarvoor is ingericht — de SDK gebruikt een pop-up en verificatie in plaats van dat je authorize + token-POST handmatig opbouwt.

Voor concrete React- en vanilla-patronen (alleen placeholders), zie Intastellar Sign-In — React en JavaScript.

Flowsamenvatting (handmatige code + PKCE)

1. Genereer code_verifier (hoog-entropie willekeurige string) en leid code_challenge af (S256).
2. Bewaar code_verifier waar je die bij de callback kunt lezen — bijv. sessionStorage voor het tabblad, of een versleutelde cookie via een kleine BFF.
3. Redirect naar AUTHORIZATION_ENDPOINT met code_challenge / code_challenge_method=S256.
4. Bij callback stuur je code + code_verifier naar je backend (aanbevolen) of naar het token endpoint als je product publieke clients zonder secret toestaat (bevestig in je console).

Geef de voorkeur aan een backend-for-frontend (BFF)

Zelfs in een SPA zijn token exchange en refresh veiliger op een same-origin-API:

• De browser krijgt alleen een opaque sessiecookie van je API.
• Refresh tokens raken nooit localStorage.
• CORS en CSRF zijn op jouw domein eenvoudiger te beheersen.

Als je tokens volledig in de browser moet afhandelen, minimaliseer de levensduur, vermijd localStorage voor refresh tokens en behandel XSS als volledige sessiecompromittering.

CORS en iframes

Embed de Intastellar login-UI niet in een verborgen iframe tenzij het product expliciet stille of ingebedde flows ondersteunt. Geef de voorkeur aan volledige pagina-redirect voor aan- en afmelden.

Veelgestelde vragen

Is de React-pop-up hetzelfde als PKCE-redirect?

Nee. Het SDK-pop-up-pad is een andere integratiestijl. Deze pagina gaat over redirect + PKCE als je de flow zelf bouwt.

“CORS error” bij aanroep van het token endpoint vanuit JavaScript

Vaak verwacht — veel token endpoints zijn niet bedoeld om direct vanuit de browser te worden aangeroepen. Gebruik jouw backend of een BFF.

Volgende

Server-side (vertrouwelijke) clients als je ook een traditionele backend met een secret draait.