How to make a websocket (and simple chat application) on Serverless infrastructure
chat application
This is the template for a simple chat application. It is built using a Node.js socket made up of API gateway component with WEBSOCKET protocol and 3 SCF (Serverless Cloud Functions) functions, namely a register function, transport function and clean up function. It is also connected to a MongoDB database which is needed to store current connections to the websocket so that messages can be transmitted to all clients. A demo can be found here.
Prepare
Before all below steps, you should install Serverless Framework globally:
$ npm i serverless -g
Download
Severless cli is very convenient, it can download templates in any github
project which should contain serverless.yml
file.
$ serverless init -t chat-app
Bootstrap
Copy .env.example
file to .env
in project root:
Add the access keys of a
Tencent CAM Role with
AdministratorAccess
in the .env
file, like below:
# .env
TENCENT_SECRET_ID=xxx
TENCENT_SECRET_KEY=xxx
# change to your requirement
REGION=ap-guangzhou
MONGODB_URL=xxx
You can go to MongoDB Atlas to make an account and a cluster, and copy the MONGO_URL to the cluster and paste it in the .env file. You will then need to install mongodb in all 3 folders containing the functions for the apigateway.
npm i mongodb
Deploy
$ sls deploy
serverless ⚡ framework
chat-interface:
region: ap-guangzhou
website: http://chat-bucket-yyy.cos-website.ap-guangzhou.myqcloud.com
vendorMessage: null
wsconnect:
functionName: wsconnect-dev
description: This is a function in chat-app application
namespace: default
runtime: Nodejs10.15
handler: connect.main_handler
memorySize: 128
lastVersion: $LATEST
traffic: 1
triggers:
vendorMessage: null
wsdisconnect:
functionName: wsdisconnect-dev
description: This is a function in chat-app application
namespace: default
runtime: Nodejs10.15
handler: disconnect.main_handler
memorySize: 128
lastVersion: $LATEST
traffic: 1
triggers:
vendorMessage: null
wstrans:
functionName: wstrans-dev
description: This is a function in chat-app application
namespace: default
runtime: Nodejs10.15
handler: transmit.main_handler
memorySize: 128
lastVersion: $LATEST
traffic: 1
triggers:
vendorMessage: null
websocketapi:
protocols: http&https
subDomain: service-xxx-yyy.gz.apigw.tencentcs.com
environment: release
region: ap-guangzhou
serviceId: service-xxx
apis:
-
path: /pgws
method: GET
apiId: abcd
internalDomain: http://set-websocket.cb-common.apigateway.tencentyun.com/abcd
vendorMessage: null
56s › chat-application › Success
After deploying, you will need to change line 55 of the chat-interface/client.html file to the subDomain of the websocketapi in order to be able to connect to the websocket that was just created. You will also need to change line 29 of function_wstrans/transmit.js to the internal domain of the websocketapi, which is the reverse push address of API Gateway. Then re-deploy those two instances.
Here, a MongoDB database was created on MongoDB Atlas and linked to the project using a MONGO_URL environment variable. However, you may also directly use Tencent's Mongodb component to automatically create a Tencent Database for MongoDB. Then just uncomment the lines in the register, transport and clean up functions related to TCB (Tencent Database).
Remove
$ sls remove
serverless ⚡ framework
15s › chat-app › Success