OAuth 2.0 flow in HLD - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to identify the first step in the OAuth 2.0 flow.

HLD

User initiates the OAuth 2.0 flow by sending a request to the [1] endpoint.

Drag options to blanks, or click blank then click option'

AClient Application

BResource Server

CAuthorization Server

DUser Database

Attempts:

3 left

💡 Hint

Common Mistakes

Confusing the Resource Server with the Authorization Server.

Thinking the Client Application initiates the flow directly.

The OAuth 2.0 flow starts when the user sends a request to the Authorization Server to get permission.

2fill in blank

medium

Complete the code to specify the token type returned by the Authorization Server.

HLD

After successful authorization, the server returns an access token of type [1].

Drag options to blanks, or click blank then click option'

ABearer Token

BRefresh Token

CID Token

DSession Token

Attempts:

3 left

💡 Hint

Common Mistakes

Confusing Refresh Token with Access Token.

Using Session Token which is not part of OAuth 2.0.

The Authorization Server returns a Bearer Token which the client uses to access protected resources.

3fill in blank

hard

Fix the error in the OAuth 2.0 flow step where the client exchanges the authorization code.

HLD

Client sends the authorization code to the [1] to exchange it for an access token.

Drag options to blanks, or click blank then click option'

AResource Server

BUser Agent

CClient Application

DAuthorization Server

Attempts:

3 left

💡 Hint

Common Mistakes

Sending the code to the Resource Server instead of the Authorization Server.

Confusing the Client Application as the recipient of the code.

The client must send the authorization code to the Authorization Server to get an access token.

4fill in blank

hard

Fill both blanks to complete the OAuth 2.0 flow diagram steps.

HLD

1. User requests access from [1].
2. Client uses an access token to access the [2].

Drag options to blanks, or click blank then click option'

AAuthorization Server

BRefresh Token

CResource Server

DClient Application

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up the roles of Authorization Server and Resource Server.

Using Refresh Token instead of access token for resource access.

The user requests access from the Authorization Server, and the client uses the access token to access the Resource Server.

5fill in blank

hard

Fill all three blanks to complete the OAuth 2.0 token request code snippet.

HLD

POST /token HTTP/1.1
Host: [1]
Content-Type: application/x-www-form-urlencoded

grant_type=[2]&code=[3]

Drag options to blanks, or click blank then click option'

Aauthorization-server.com

Bauthorization_code

Cauth_code_value

Dresource-server.com

Attempts:

3 left

💡 Hint

Common Mistakes

Using Resource Server as host instead of Authorization Server.

Using wrong grant_type values.

Confusing the authorization code with other tokens.

The token request is sent to the Authorization Server with grant_type 'authorization_code' and the actual authorization code value.

Practice

1. What is the main purpose of the OAuth 2.0 Authorization Code flow?

easy

A. To replace user authentication with biometric data

B. To store user passwords safely on the server

C. To allow apps to access user data securely without sharing passwords

D. To encrypt all user data before sending it

Solution

1. Step 1: Understand OAuth 2.0 Authorization Code flow

   This flow lets apps get permission to access user data without needing the user's password directly.

2. Step 2: Identify the main goal

   The goal is to keep user credentials safe while allowing apps to act on behalf of the user.

3. Final Answer:

   To allow apps to access user data securely without sharing passwords -> Option C

4. Quick Check:

   OAuth 2.0 Authorization Code flow = Secure app access without passwords [OK]

Hint: Remember: OAuth avoids sharing passwords directly [OK]

Common Mistakes:

• Confusing OAuth with password storage
• Thinking OAuth encrypts all user data
• Assuming OAuth replaces authentication methods

2. Which of the following is the correct sequence in the OAuth 2.0 Authorization Code flow?

easy

A. User logs in -> App receives access token -> App requests authorization code

B. App sends password -> User grants access -> App receives token

C. App directly receives access token -> User logs in -> Access granted

D. User logs in -> App gets authorization code -> App exchanges code for access token

Solution

1. Step 1: Recall the OAuth 2.0 Authorization Code flow steps

   User logs in and authorizes the app, which then receives an authorization code.

2. Step 2: Understand token exchange

   The app exchanges the authorization code for an access token to access user data.

3. Final Answer:

   User logs in -> App gets authorization code -> App exchanges code for access token -> Option D

4. Quick Check:

   Authorization Code flow sequence = Login, code, token [OK]

Hint: Authorization code comes before access token [OK]

Common Mistakes:

• Thinking app gets token before authorization code
• Confusing password sending with OAuth flow
• Mixing order of login and token receipt

3. Given this OAuth 2.0 flow snippet, what is the expected output after exchanging the authorization code?

POST /token
Headers: Content-Type: application/x-www-form-urlencoded
Body: grant_type=authorization_code&code=abc123&redirect_uri=https://app.com/callback&client_id=client123&client_secret=secretXYZ

Response:
{
  "access_token": "token456",
  "token_type": "Bearer",
  "expires_in": 3600
}

medium

A. An access token 'token456' valid for 3600 seconds

B. An error because client_secret is missing

C. A refresh token instead of access token

D. No token, only a confirmation message

Solution

1. Step 1: Analyze the token request

   The app sends a POST request with grant_type authorization_code and includes the code and client credentials.

2. Step 2: Interpret the response

   The response contains an access_token 'token456', token_type 'Bearer', and expires_in 3600 seconds, meaning the token is valid for one hour.

3. Final Answer:

   An access token 'token456' valid for 3600 seconds -> Option A

4. Quick Check:

   Token response includes access_token and expiry [OK]

Hint: Token response includes access_token and expiry time [OK]

Common Mistakes:

• Expecting refresh token instead of access token
• Missing client_secret causes error
• Confusing confirmation message with token response

4. A developer implements OAuth 2.0 Authorization Code flow but the app never receives an access token after exchanging the code. What is the most likely cause?

medium

A. The app forgot to include the client_id in the authorization request

B. The redirect URI used in the token request does not match the one registered

C. The user did not enter their password correctly

D. The access token expired before the request

Solution

1. Step 1: Identify common OAuth token exchange errors

   One frequent error is a mismatch in redirect URI between authorization and token requests.

2. Step 2: Understand impact of redirect URI mismatch

   If the redirect URI differs, the authorization server rejects the token request, so no access token is returned.

3. Final Answer:

   The redirect URI used in the token request does not match the one registered -> Option B

4. Quick Check:

   Redirect URI mismatch blocks token issuance [OK]

Hint: Check redirect URI matches exactly in all requests [OK]

Common Mistakes:

• Blaming user password errors for token issues
• Ignoring client_id in authorization request
• Assuming token expires before it is issued

5. You are designing a system that uses OAuth 2.0 Authorization Code flow for a mobile app and a web app. Which approach best secures the access tokens and refresh tokens?

hard

A. Use Authorization Code flow with PKCE for the mobile app and standard Authorization Code flow for the web app

B. Use Implicit flow for both apps to simplify token handling

C. Store access tokens in local storage for both apps to allow easy access

D. Send access tokens directly in URL query parameters for both apps

Solution

1. Step 1: Understand security needs for mobile and web apps

   Mobile apps cannot keep client secrets safe, so PKCE (Proof Key for Code Exchange) enhances security for Authorization Code flow.

2. Step 2: Choose best practices for token storage and flow

   Web apps can use standard Authorization Code flow with client secret. Implicit flow is deprecated due to security risks. Storing tokens in local storage or URLs exposes them to attacks.

3. Final Answer:

   Use Authorization Code flow with PKCE for the mobile app and standard Authorization Code flow for the web app -> Option A

4. Quick Check:

   PKCE secures mobile OAuth; standard flow suits web apps [OK]

Hint: Use PKCE for mobile apps, standard flow for web apps [OK]

Common Mistakes:

• Using Implicit flow despite security risks
• Storing tokens insecurely in local storage
• Passing tokens in URL parameters