Build a Serverless Web Application Part 2— Cognito

AWS Build a Serverless Web Application

This is a walk through lab based on AWS project. For more details please refer here. This walk through breaks into four parts which are

  1. Host a static website
  2. Manage users
  3. Build serverless backend
  4. Deploy a RESTful API

In part 2, we will setup Amazon Cognito which provides user to register an account, send confirmation email with verification code and to do logins.

When user sign in, a JavaScript function communicates with Cognito, authenticate user using Secure Remote Password protocol(SRP), and receives back a set of JSON Web Tokens(JWT). JWTs contain the identity of user and can be used to authenticate against the RESTful API build with Amazon API Gateway in next part.

Amazon Cognito provides two different mechanisms for authenticating users. You can use Cognito “User Pools” to add sign-up and sign-in functionality to your application or use Cognito “Identity Pools” to authenticate users through social identity providers such as Facebook, Twitter, or Amazon, with SAML identity solutions, or by using your own identity system.

In this part, we will be using User Pools, let’s go ahead and create one.

AWS Build a Serverless Web Application
AWS Build a Serverless Web Application

Give your Pool a name. You can choose “Review defaults” to finish the setup but I will step through settings for every steps.

AWS Build a Serverless Web Application

The purpose of step through settings is to record all step details.

AWS Build a Serverless Web Application
AWS Build a Serverless Web Application
AWS Build a Serverless Web Application
AWS Build a Serverless Web Application
AWS Build a Serverless Web Application
AWS Build a Serverless Web Application
AWS Build a Serverless Web Application

At this step, we need to add an app which will interact with Cognito.

AWS Build a Serverless Web Application
AWS Build a Serverless Web Application
AWS Build a Serverless Web Application
AWS Build a Serverless Web Application
AWS Build a Serverless Web Application

And finally the last step to create User Pool.

AWS Build a Serverless Web Application

Finish view. Copy “Pool Id” and “App Client Id” from App clients for later use.

AWS Build a Serverless Web Application
AWS Build a Serverless Web Application

Now, in order for JavaScript to communicate with Cognito, we need to modify a file, config.js, which is provided by AWS.

AWS Build a Serverless Web Application

Paste Pool Id, App Client Id and region into the code. We will input invokeUrl once API Gateway is done. Save config.js and replace the one we uploaded to S3 in part 1.

AWS Build a Serverless Web Application
AWS Build a Serverless Web Application

Choose the file we just modified and upload it.

AWS Build a Serverless Web Application

File size is changed from 307B to 370B.

AWS Build a Serverless Web Application

Lastly, let’s verify if JavaScript is configured to communicate with Cognito correctly. We need to register an account and login to that account. Open your static webpage, you can get your url from here, append /register.html

AWS Build a Serverless Web Application

Enter your email and assign a password to it. Password must fulfill conditions set in Cognito. Once done, click LET’S RYDR!

AWS Build a Serverless Web Application
AWS Build a Serverless Web Application

If everything is configured correctly, you will be redirected to verify.html. Once you received the notification mail, key in the verification code. Check your spam mail box if you don’t see the mail.

AWS Build a Serverless Web Application
AWS Build a Serverless Web Application

Or you can verify the email manually from Cognito console as below.

AWS Build a Serverless Web Application
AWS Build a Serverless Web Application

Once account is verified, verify if the account can login.

AWS Build a Serverless Web Application

If everything is configured correctly, you will see the image below.

AWS Build a Serverless Web Application

And that’s it, Part 2 is done!

Module 2. User Management

AWS Certified SA, SysOps & Developer Associate, Alibaba Cloud certified SA. Focusing on Azure, Prometheus w/ Grafana, ELK and K8S now.