javascript
12 lines · 1 tab
Kai Nakamura
Apr 2026
1 tab
import { sha256 } from './crypto.js';
const codeVerifier = crypto.randomUUID() + crypto.randomUUID();
sessionStorage.setItem('pkce_verifier', codeVerifier);
const digest = await sha256(codeVerifier);
const codeChallenge = btoa(String.fromCharCode(...new Uint8Array(digest)))
.replace(/\+/g, '-')
.replace(/\//g, '_')
.replace(/=+$/, '');
location.href = `https://auth.example.com/oauth/authorize?response_type=code&client_id=spa-client&code_challenge_method=S256&code_challenge=${codeChallenge}`;
1 file · javascript
Explain with highlit
For browser and mobile clients, PKCE closes an important hole in the classic authorization code flow. I use it by default with public clients, require exact redirect URI matching, and keep token exchange on TLS only. This is one of those cases where the secure default should also be the ergonomic default.
Share this code
Here's the card — post it anywhere.
