Skip to demo content
Step 1 of 7: User clicks Sign in with Google
← All demos

OAuth2 Social Login with Google

1. User clicks Sign in with Google

User navigates to the app dashboard or clicks 'Sign in with Google'. The app checks for a valid session and finds none, so it generates PKCE parameters (code_verifier + code_challenge), a random state for CSRF protection, and a nonce for token replay prevention, then redirects to Google's authorization endpoint.

What the user sees

https://secrets.example.com/dashboard
Demo simulation — do not enter real credentials
Redirecting to login...

What's happening (HTTP)

  1. REQUEST Browser → App
    GET https://secrets.example.com/dashboard
    Cookie: (none)
    No session cookie present
  2. INTERNAL App → App
    Generate OAuth2 parameters
    Generate code_verifier (random 43-char string), compute code_challenge = BASE64URL(SHA256(code_verifier)), generate random state and nonce. Store all three server-side keyed by session.
  3. RESPONSE App → Browser
    302 Found
    Location: https://accounts.google.com/o/oauth2/v2/auth?
    client_id=123456789.apps.googleusercontent.com
    &redirect_uri=https://secrets.example.com/auth/callback
    &response_type=code
    &scope=openid email profile
    &state=xYz9Kp2mN7qR4sT1
    &nonce=aB3cD5eF7gH9iJ1k
    &code_challenge=E9Melhoa2OwvFrEMTJguCHaoeK1t8URWbuGJSstw-cM
    &code_challenge_method=S256
    Redirect to Google with PKCE challenge, state, and nonce. No access_type=offline: this flow only signs the user in.

Legend

Browser request
Server response
Server-to-server
Internal
← All demos
An educational demo, not a reference implementation v0.3.0