Single-page applications cannot safely store a client secret. Use the authorization code flow with PKCE only, or use the official @intastellar/signin-sdk-react package if you target React and Intastellar supports it for your client — the SDK uses a popup and token verification instead of you wiring the authorize URL and token POST by hand.
For React and vanilla JS patterns (with placeholder examples only), see Intastellar Sign-In — React SDK and plain JavaScript.
Flow summary (manual code + PKCE)
- Generate
code_verifier(high-entropy random string) and derivecode_challenge(S256). - Store
code_verifierwhere you can read it on callback — e.g.sessionStoragefor the tab, or an encrypted cookie via a small BFF. - Redirect to
AUTHORIZATION_ENDPOINTwithcode_challenge/code_challenge_method=S256. - On callback, send
code+code_verifierto your backend (recommended) or to the token endpoint if the product allows public clients without a secret (confirm in console).
Prefer a backend-for-frontend (BFF)
Even in a SPA, the token exchange and refresh are safer on a same-origin API:
- Browser receives only an opaque session cookie from your API.
- Refresh tokens never touch
localStorage. - CORS and CSRF can be controlled on your domain.
If you must handle tokens entirely in the browser, minimize lifetime, avoid localStorage for refresh tokens, and plan for XSS as a full compromise of the session.
CORS and iframes
Do not embed the Intastellar login UI in a hidden iframe unless the product explicitly supports silent or embedded flows. Prefer full-page redirect for sign-in and sign-out.
Next
Server-side (confidential) clients if you also serve a traditional backend.
Last updated