What is a PKCE code verifier?
The code_verifier is a fresh, high-entropy secret created for one OAuth authorization request. The client derives a code_challenge from it and sends the challenge in the browser-facing authorization request. After receiving an authorization code, the client sends the original verifier to the token endpoint. The authorization server checks that the two values match before issuing tokens.
For the recommended S256 method:
code_challenge = BASE64URL(SHA256(ASCII(code_verifier)))
Base64URL here has no = padding. The verifier must contain 43–128 characters from A–Z, a–z, 0–9, -, ., _, and ~. RFC 7636 recommends generating 32 random bytes and Base64URL-encoding them: that gives a 43-character verifier. The S256 method is preferred over plain.
Generate a pair
Use the PKCE Generator for a browser-generated S256 pair. It creates 32 random bytes with Web Crypto and hashes the verifier locally. To implement the same process in a browser client:
const base64url = (bytes) =>
btoa(String.fromCharCode(...bytes))
.replace(/\+/g, "-").replace(/\//g, "_").replace(/=/g, "");
const random = crypto.getRandomValues(new Uint8Array(32));
const codeVerifier = base64url(random);
const digest = await crypto.subtle.digest(
"SHA-256", new TextEncoder().encode(codeVerifier)
);
const codeChallenge = base64url(new Uint8Array(digest));
Run this in a secure browser context. Generate a new pair per authorization attempt; do not hard-code the sample output or reuse a verifier across users. An OAuth library usually handles this flow for you.
Where each value goes
The authorization request carries the challenge, not the verifier. The example endpoints and IDs below are placeholders from a hypothetical provider:
GET https://idp.example.com/authorize?
response_type=code&
client_id=example-client&
redirect_uri=https%3A%2F%2Fapp.example.com%2Fcallback&
state=random-state-bound-to-this-request&
code_challenge=GENERATED_CHALLENGE&
code_challenge_method=S256
After the browser returns with a code, check the state value and exchange the code at the token endpoint. Send the verifier in the form body over HTTPS:
POST /token HTTP/1.1
Host: idp.example.com
Content-Type: application/x-www-form-urlencoded
grant_type=authorization_code&code=RETURNED_CODE&redirect_uri=https%3A%2F%2Fapp.example.com%2Fcallback&client_id=example-client&code_verifier=ORIGINAL_VERIFIER
The provider may require additional parameters or client authentication. Keep the verifier associated with this one pending login and out of URLs, analytics, and logs. If the wrong verifier is sent, the token exchange should fail, commonly with invalid_grant. PKCE helps protect an intercepted authorization code; it does not replace state, exact redirect URI checks, TLS, or server-side token validation. See What Is OAuth 2.0? for the wider flow.