Cognito custom flow sign-in sends a confirm code via email
Aidan
Posted on March 29, 2024
Hi every one!!!
Emotional conversation between boss and employee
Boss: Do you know about Cognito?
Employee: I know a lot about it so what do you need?
Boss: I need to develop more on the login page about 2fa confirmation codes via email & email only, customers need it urgently.
Employee: I think Cognito has all the support so no need to worry. I talked to my boss about it and assured me that I could do everything.
Boss: Does it take a long time?
Employee: I'm a master at this so it'll be quick.
So then he discovered the flow login feature only supports mfa with TOTP & SMS
OMGGGGGGG ●█▀█▄ ●█▀█▄ ●█▀█▄ ●█▀█▄
Please read this article it will help you \ʕ •ᴥ•ʔ/
AWS
https://docs.aws.amazon.com/cognito/latest/developerguide/user-pool-lambda-challenge.html
Prepare:
Cognito create user pool
Create 3 lambda function: 2faDefine.js, 2faCreate.js, 2faVerify.js
Cognito user pool
Note: User pool ID & App client ID
The newly created user has confirmation status is Force change password
, now you need to run the script below to update confirmation status
from Force change password
to Confirmed
.
aws cognito-idp admin-set-user-password --user-pool-id {user pool ID} --username {username} --password {password} --permanent
Add custom attributes authChallenge
, so after saving it will automatically add the prefix custom:
, ouput custom:authChallenge
.
This custom attribute contains a confirmation code and expiration time information when the end user submits a login.
You find App client list
, so click Client your app
.
This custom attribute
custom:authChallenge
must have read and write permissions.Option
Authentication flow session duration
has a value equal to the expiration time of the confirm-code.Option
Authentication flows
has a valueALLOW_ADMIN_USER_PASSWORD_AUTH, ALLOW_CUSTOM_AUTH, ALLOW_REFRESH_TOKEN_AUTH, ALLOW_USER_PASSWORD_AUTH, ALLOW_USER_SRP_AUTH
.
Add Lambda trigger with trigger type
Custom authentication
Custom authentication
Choose
Define auth challenge
mapping to lambda function2faDefine
.
ChooseCreate auth challenge
mapping to lambda function2faCreate
.
ChooseVerify auth challenge response
mapping to lambda function2faVerify
.
Lambda deploy with code
1./ Function 2faDefine
https://bitbucket.org/main-28/cognito-sign-in-confirm-code-via-email/src/main/2faDefine.js
2./ Function 2faCreate
https://bitbucket.org/main-28/cognito-sign-in-confirm-code-via-email/src/main/2faCreate.js
Tab Configuration > General configuration
Change value of the option timeout up 5 minute because
nodemailer
send email not working.
Tab Configuration > Environment variables
CUSTOM_ATTRIBUTES = custom:authChallenge
EMAIL_FROM_ADDRESS = xxxxx@xxxxxxxxx.xxx
USER_POOL_ID = xxxxxxxxx
3./ Function 2faVerify
https://bitbucket.org/main-28/cognito-sign-in-confirm-code-via-email/src/main/2faVerify.js
Tab Configuration > Environment variables
CONFIRM_CODE_TIMEOUT = 15
CUSTOM_ATTRIBUTES = custom:authChallenge
Frontend Angular
Libary
[amazon-cognito-identity-js](https://www.npmjs.com/package/amazon-cognito-identity-js)
,[angular-code-input](https://www.npmjs.com/package/angular-code-input)
Git: https://bitbucket.org/main-28/cognito-sign-in-confirm-code-via-email/src/main/login.component.ts
Form login: when the end user clicks submit, it will call the function
onSubmitLogin
.
Form confirm code: when the end user enters the confirm-code, it will call the functiononCodeCompleted
.
Note:
If you want to refactor code, make sure the code example works first.
Please comment any issues you encounter and I will try to answer you.
Posted on March 29, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.