Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥

How to use Amazon Cognito user pools with custo...

How to use Amazon Cognito user pools with custom UI and also OIDC

This is the presentation material at JAWS Pankration 2024, held from 8/24/2024 to 8/25/2024.

Ken'ichirou Kimura

August 24, 2024
Tweet

More Decks by Ken'ichirou Kimura

Other Decks in Technology

Transcript

  1. How to use Amazon Cognito user pools with custom UI

    and also OIDC Kenichiro Kimura [AWS Community Builders] [JAWS-UG Fukuoka]
  2. Who am I Name: Kenichiro Kimura Country: Japan / Fukuoka

    Occupation: Technical Architect Company: Alterbooth,INC Award: - AWS APJ Community Leaders Award 2023 - AWS Samurai 2019 Community: - JAWS-UG Fukuoka(organizer) - AWS Community Builders @show_m001 kenichirou.kimura 2
  3. Conclusion -You can use OIDC endpoint for Amazon Cognito user

    pools with custom UI, by using AWS Amplify Identity broker -There are some limitations: - Missing functions need to be developed by yourself - Cannot use fully OIDC functions -If you want to use custom UI and OIDC at the same time in Cognito user pools, please try it. 3
  4. What is Cognito user pools? An Amazon Cognito user pool

    is a user directory for web and mobile app authentication and authorization. From the perspective of your app, an Amazon Cognito user pool is an OpenID Connect (OIDC) identity provider (IdP). (https://docs.aws.amazon.com/en_us/cognito/latest/developerguide/cognito-user-identity-pools.html) 4
  5. OIDC Authorization flow with Cognito user pools 5 GET /oauth2/authorize?redirect_uri={redirect_uri}..

    Location: /login?redirect_uri={redirect_uri}… GET /login?redirect_uri={redirect_uri}… (hosted UI Page) (Sign in) Location: {redirect_uri}?id_token=eyXXXXX
  6. About hosted UI What is hosted UI? -UI prepared in

    Cognito User pools for flows such as sign- in and sign-up. -You can customize hosted UI, but limited looks only - Upload logo image - Use custom css 6
  7. Customize login flow(sign-up/sign-in...) To customize your login flow(sign-up/sign-in/forgot password/reset-password…), -

    Develop UI using Cognito SDK - Cognito user pools’ OIDC endpoints are not available What should we do to use OIDC endpoints with custom UI ? - Develop your own OIDC endpoints? 7
  8. AWS Amplify Identity Broker A code sample provided as an

    illustration of how to achieve and identity broker and SSO on top of Amazon Cognito by awslabs. https://github.com/awslabs/aws-amplify-identity-broker/ 8
  9. Features -Login flows: sign-in, sign-up, forgot password, reset- password -Is

    a standard OIDC Identity Provider -PKCE and Implicit Oauth2 flows -100% UI customizable(React + Amplify JS) -I18n -Federations: Social login, SAML, OIDC 9
  10. OIDC Authorization flow with Identity Broker(1) 11 GET /oauth2/authorize?redirect_uri={redirect_uri}.. Location:

    /?redirect_uri={redirect_uri}… GET /?redirect_uri={redirect_uri}… (React UI Page) (Sign in) Tokens or code Check session API Call POST /storage Location: {redirect_uri}?id_token=eyXXXXX
  11. OIDC Authorization flow with Identity Broker(2) 12 GET /oauth2/authorize?redirect_uri={redirect_uri}.. Location:

    https://server/?redirect_uri={redirect_uri}… GET /some-uri?redirect_uri={redirect_uri}… (Original UI Page) (Sign in) Tokens or code Check session API Call Redirect with Tokens or code Location: {redirect_uri}?id_token=eyXXXXX POST /storage
  12. Features which not implemented -Authorization endpoint - HTTP POST -

    scope parameter - response_type(only id_token and code, currently) - Other OPITONAL features - display, prompt, id_token_hint,… -Token endpoint - http response header(Cache-control: no-store) 13
  13. Limitation You can’t use nonce parameter -Nonce is OPTIONAL function

    in oidc documents - But it is REQUIRED if you use implicit flow -Nonce must be in id token signed by idp - Only idp can manipulates id token -Cognito API does not allow the providing of a nonce - Hosted UI can provide a nonce - Use PKCE flow instead of implicit flow 14
  14. Conclusion -You can use OIDC endpoint for Amazon Cognito user

    pools with custom UI, by using AWS Amplify Identity broker. -There are some limitations: - Missing functions need to be developed by yourself - Cannot use fully OIDC functions, such as nonce parameter -Limited Support by AWS -If you want to use custom UI and OIDC at the same time in Cognito user pools, please try it out. 15