top of page

Tutorial Blog to build serverless chat application

Learning Objectives: -

1. Learn to create serverless chat application with a WebSocket API.

2. Learn to use CloudFormation template to create Lambda function & DynamoDB table.

Step 1: Download and unzip this template

Step 2: In AWS management console, go to CloudFormation.

Choose Create Stack and then choose with new resources(standard).

For Specify template, choose Upload a template file.

Select the template that you downloaded.

Choose Next.

For Stack name, enter websocket-api-chat-app-tutorial and then choose Next.

For Configure stack options, choose Next.

For Capabilities, acknowledge that AWS CloudFormation can create IAM resources in your account.

Choose Submit.

AWS CloudFormation provisions the resources specified in the template. It can take a few minutes to finish provisioning your resources. When the status of your AWS CloudFormation stack is CREATE_COMPLETE, you're ready to move on to the next step.

Step 3: In AWS management console, go to API Gateway.

Choose Create API. Then for WebSocket API, choose Build.

For API name, enter websocket-chat-app-tutorial.

For Route selection expression, enter request.body.action. The route selection expression determines the route that API Gateway invokes when a client sends a message.

Choose Next.

For Predefined routes, choose Add $connect, Add $disconnect, and Add $default. The $connect and $disconnect routes are special routes that API Gateway invokes automatically when a client connects to or disconnects from an API. API Gateway invokes the $default route when no other routes match a request.

For Custom routes, choose Add custom route. For Route key, enter sendmessage. This custom route handles messages that are sent to connected clients.

Choose Next.

Under Attach integrations, for each route and Integration type, choose Lambda.

For Lambda, choose the corresponding Lambda function that you created with AWS CloudFormation in Step 1. Each function's name matches a route. For example, for the $connect route, choose the function named websocket-chat-app-tutorial-ConnectHandler.

Review the stage that API Gateway creates for you. By default, API Gateway creates a stage name production and automatically deploys your API to that stage. Choose Next.

Choose Create and deploy.

Step 4: Choose your API.

Choose Stages, and then choose production.

Note your API's WebSocket URL. The URL should look like wss://abcdef123.execute-api.us-east-2.amazonaws.com/production.

Use the following command to connect to your API.

npm install -g wscat

Replace your WebSocket URL with the highlighted part in red.

wscat -c wss://abcdef123.execute-api.us-west-2.amazonaws.com/production

Open a new terminal and run the wscat command again with the following parameters.

npm install -g wscat

Replace your WebSocket URL with the highlighted part in red.

wscat -c wss://abcdef123.execute-api.us-west-2.amazonaws.com/production

Write the following message in the command prompt

{"action": "sendmessage", "message": "Hello, from Cloud-PlusPlus"}

The Lambda function associated with the invoked route collects the client IDs from DynamoDB. Then, the function calls the API Gateway Management API and sends the message to those clients. All connected clients receive the following message:

Terminal 1:

Terminal 2:

To disconnect from your API

Press CTRL+C to disconnect from your API. When a client disconnects from your API, API Gateway invokes your API's $disconnect route. The Lambda integration for your API's $disconnect route removes the connection ID from DynamoDB.

Note: Delete the WebSocket API and CloudFormation Stack if no longer needed.


Was this document helpful? How can we make this document better. Please provide your insights. You can download PDF version for reference.


WebSocket_API
.pdf
Download PDF • 997KB

For your aws certification needs or for aws learning contact us.

bottom of page