Search code examples
amazon-cognitocallbackurl

How to integrate the AWS Cognito built-in UI?

I've been experimenting with Cognito for a few days, and I am now testing the Built-in signing UIs. I have managed to get it working, I am able to see the login page and successfully login with a User I have created. For my callback URL I'm using localhost:3000 as a testing ground, where I'm running a React SPA.

However, I am at a complete loss about what to do once I'm redirected. The documentation says I should get a URL with a JWT as a query parameter. Instead, I'm getting a URL of the form:

localhost:3000/?code=########-####-####-####-############

where # is an alphanumeric character. I don't recognize this code, I don't think it is a JWT. I would highly appreciated it anyone could:

  1. explain what it is
  2. direct me to any kind of documentation on how to use it?
Solution

  • After redirection, You are getting localhost:3000/?code=########-####-####-####-############

    This means you have enabled code grant flow

    This code is used to get the tokens from Amazon Cognito.

    Request Type: POST

    URL: https://mydomain.auth.us-east-1.amazoncognito.com/oauth2/token

    PayLoad: grant_type=authorization_code& client_id=<CLIENT_ID>& code=<AUTHORIZATION_CODE>& redirect_uri=com.myclientapp://myclient/redirect

    Here you can see we are passing code in the payload with redirect url.

    The response of this POST request will be your tokens ( If Successful authentication :) )

    Sample Response:

    {
 "access_token":"eyJz9sdfsdfsdfsd",
 "refresh_token":"dn43ud8uj32nk2je",
 "id_token":"dmcxd329ujdmkemkd349r",
 "token_type":"Bearer", 
 "expires_in":3600
}

    You can save this token in your localstorage or sessionstorage for further custom authentication.

    Please refer all the available endpoints of amazon cognito for more details.

    Ex: Authorization Endpoint Token Endpoint

    I hope now it makes clear to you!