AWS Cognito OAuth 2.0 Authorization code Flow

By Rex Resurreccion May 05, 2020
AWS Cognito OAuth 2.0 Authorization code Flow

How to use AWS Cognito OAuth 2.0 Authorization code Flow?

This tutorial will discuss the OAuth flows in three parts, and you are reading Part 2. If you are interested about Implicit grant or if you missed the introduction please read AWS Cognito OAuth 2.0 Implicit Flow first.

Authorization code grant

I mentioned in our introduction the steps on how you can setup your App Client to use OAuth flows under App Integration setting. If you have not done this I suggest reading that section of the tutorial first.

To enable this grant put a check on Authorization code grant and click on Save Changes button. Also the App Client using this flow must NOT generate a Client Secret key, otherwise the authentication will not work.

Like the Implicit grant, this OAuth flow is also applicable for Front-End application. But instead of getting the user pool tokens directly, the Authorization code grant will  return a separate authorization code that is then exchanged for the user pool tokens.

In this OAuth flow, the user pool tokens are not exposed to the end user, thus making it more secured than Implicit grant. But in order to get the user pool tokens you will need to submit an HTTP Post request to the TOKEN Endpoint using the authorization code.

Testing Using the Hosted UI

Now we can quickly test the Authorization code by using the Hosted UI. Click on Launch Hosted UI link at the bottom of the app settings panel.

Testing Using the Hosted UI in Authorization code Flow

You will get redirected to a Sign In page. Enter the Username and password of your test User. Again, if you have not created a test User, I have explained the steps in the first part of this tutorial.

Cognito Hosted Sign In page for Authorization code Flow

On successful Sign In, you should get the authorization code in the Callback URL.

https://www.yippeecode.com/aws/cognito/testui/successful-login?code=28527a2e-e39a-450d-b0cd-c10969647e4c

With a few lines of Javascript code you can extract the code query parameter and use this in exchange for user pool tokens.

const cognitoAuth = new URLSearchParams(window.location.search);
const authCode= cognitoAuth.get('code');

TOKEN Endpoint

Here I’m using Postman to demonstrate the exchange of authorization code for user pool Tokens.

Use Postman to demonstrate the exchange of authorization code

Form Request Body parameters:

grant_type – Must be authorization_code, the flow that we are using here. client_id – App Client ID in the User pool.
code – Authorization code grant, from the result of a successful Sign In.
redirect_url – This is the Callback URL in your App client.

The URL endpoint is something you can find in your User Pool profile. Under App Integration, go to Domain name. To complete the URL, append the path /oauth2/token to your domain.

AWS Cognito domain prefix in authorization code flow

As a result you will have a URL something like this example.

https://custom-development.auth.us-east-1.amazoncognito.com/oauth2/token

Submit an HTTP Post request with content type application/x-www-form-urlencoded. If you submitted a valid request, you should receive the user pool tokens.

Example Successful response in Postman for Authorization code flow

Now you can use the tokens on succeeding requests, access_token to retrieve the USERINFO or the refresh_token in exchange for another batch of user pool tokens.

USERINFO

Use Postman to demonstrate USERINFO endpoint in Cognito

Refresh Token

Example successful USERINFO response in Postman for Authorization code flow

On the next topic AWS Cognito OAuth 2.0 Client credentials Flow, we will discuss the OAuth flow that is used for machine-to-machine authentication.

© YippeeCode.com 2020