Cognito Managed Login Demo

Step-by-step demonstration of OAuth PKCE flow with Cognito managed login

Implicit Grant Flow

1 Client Requests Authorization
2 Authorization Server Returns Tokens

Step 1: Client Requests Authorization

Redirect to Cognito's managed login page with response_type=token to request tokens directly.

Generating authorization URL...

Step 2: Authorization Server Returns Tokens

After successful authentication, Cognito returns tokens directly in the URL fragment.

Waiting for redirect...

Authorization Code Grant Flow With PKCE

1 Create Code Verifier
2 Create Code Challenge
3 Send Code Challenge
4 Receive Code
5 Send Code & Verifier

Step 1: Client Creates a Code Verifier

Generate a cryptographically secure random string (43-128 characters) that will be used to prove the authorization request came from this client.

Step 2: Client Creates the Code Challenge

Compute the SHA-256 hash of the code verifier and base64url encode it. This challenge will be sent to the authorization server.

Not computed yet

Step 3: Client Sends the Code Challenge with the Authorization Request

Redirect to Cognito's managed login page with response_type=code and the code challenge as part of the OAuth 2.0 authorization request.

Generating URL...

Step 4: Authorization Server Returns the Code

After successful authentication, Cognito redirects back with an authorization code.

Waiting for redirect...

Step 5: Client Sends the Authorization Code and the Code Verifier to the Token Endpoint

Exchange the authorization code for ID, Access, and Refresh tokens using the code verifier.

Token endpoint URL will appear here...