How to use Amplify to authenticate against Cognito using the hosted UI and the implicit grant type?

Question

The Authentication section in https://docs.amplify.aws gives examples that end up creating a React app that hosts its own authentication form. Instead of doing that, I want to create an SPA using React that:
- Authenticates against Cognito using OIDC
- Authenticates using the Cognito hosted UI
- Uses the Implicit grant type (preferably with PKCE)

Is the above achievable with Amplify?
If so, is there a guide or any other documentation?

Answer

Hi,

From the question I understand that you want to have an application using React that authenticates with Cognito using OIDC, uses the Cognito hosted UI and uses the implicit grant type.

This can be achieved, I am attaching the following documentation that goes over setting up the hosted UI with AWS amplify here (1). You can add an OIDC provider to your user pool by following the steps outlined in this documentation here (2). Lastly you can use an implicit grant, I am attaching the following documentation that goes over the difference between the types of grants available (3). One note to mention is that a PKCE challenge can be passed with an implicit grant but is not used because the /oauth2/token is not accessed. This is because implicit grants return the ID and access token directly and do not access the refresh token.

I hope you have a great rest of your day!

References

(1)	https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-user-pools-app-integration.html#cognito-user-pools-app-integration-amplify

(2)	https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-user-pools-oidc-idp.html

(3)	https://aws.amazon.com/blogs/mobile/understanding-amazon-cognito-user-pool-oauth-2-0-grants/

How to use Amplify to authenticate against Cognito using the hosted UI and the implicit grant type?

Relevant content