Thank you!! I'm doing a demo tomorrow in my company on serverless and this was the only resource I found that explained the setup of websockets with API Gateway and Lambda so well. Finally, my demo is complete. Keep the amazing videos coming! :)
These are literally the best coding instructional on the NET!!! Awesome you use the CLI for everything were as every of instructional use the GUI. If you subscribe and follow along you will not be disappointed. 10/10!!!!!!
Complete Coding You Da Man!! Don’t change a thing!! 10/10!! I’ve really been searching the depths of the net for such quality tutorials!! Everybody else’s videos take forever to get through because they use the GUI and explain other irrelevant stuff. Plus I use VS code. Let me know if I can help. Will be spreading the word about you videos!!
I am thankful for your videos and they taught me so much . I had great experience on aws but i was not fan of serverless yaml file because of some small indentation it causes huge problem .However you made it so easy for me and i feel comfortable now to write api in serverless rather than deploying in console aws
Getting used to indent formatted code is strange coming from JavaScript but you get used to it. Glad you found it all helpful. Not having to go into the console makes things so much quicker
Thank you!! There is a sight change in newer version regarding postParams. it should be like this "ConnectionId" with capital C const postParams = { Data: message, ConnectionId: connectionID }
Nice tool, websocket.org, I usually use an npm package called wscat, where you can connect and test your socket connections in terminal on your local machine. Good tutorial, got some nice serverless tips for websockets here thanks.
Excellent video! Congratulations. I found a typo in the code of the websocketMessage.js file. In connectionId, C is capitalized. The correct one would be ConnectionId in postParams object.
@@CompleteCoding No problem. I'm watching all of your lambda videos. This gave me an incentive to learn how to use the cloudwatch and debug the code to find the source of the problem! lol In general, my congratulations for the videos! They are excellent for people like me who are learning to use lambda.
Great tutorial! What I find a bit weird in the code, that you use Responses._200({...}) as part of the websocket protocol. It looks like you're mixing HTTP and WS.
Great video thanks!!, I have a question is there any way to apply security restriction like a authorization or something to protect my wss endpoint with autorization method? Thanks
Great tutorial. I just have a quick question, is it possible to test locally without deploying these functions to aws lambda.? Afaik, y can use postman to test for the rest api, but not sure if we can use something to test for the websocket
Yes, absolutely. You can use "serverless-offline" plugin to run the whole API offline (including the websocket). This is great as it makes it really easy to tweak and update your code when you're building it. Here's a link to how to set it up ua-cam.com/video/ul_85jfM0oo/v-deo.html
If you are having issues receiving a web socket reply, the postToConnection method parameter connectionId should be ConnectionId. With a capital ‘c’. The api may have been updated since this tutorial.
In your file message.js, when you do `const messages = record.messages`, you are referencing the same Array. So, when you do `message.push(body.message)`, you are in fact pushing also in the `record.messages`, so making the `data` with spread operator in front of the record, does not make sense, as you have the same data. To create new Array of messages, you should use `const messages = [ ...record.messages ]`, then you will have the new Array without referencing the one in `record`.
I'm glad you liked the tutorial. If you want to send a message to a specific websocket then you just need to make sure that you are sending the message with the correct websocket ID. You should have one ID per connection so each message you send should just go to one websocket
You way of explaining is simply superb! I have a question - I would like to invoke an https endpoing from within the lambda, exposed on a websocket, using coinmarketcap-api node package. Though its a one liner code, it doesnt execute within the lambda - are there any restrictions that I need to configure for using this package on serverless/aws or are there any restrictions on AWS to connect with the external services ? Thanks for your help in advance!
No, there are no restrictions by default. If you've installed the package and required it into the lambda then it should just work. One thing with this is that the package uses promises. Just make sure that you're returning from the function after the promise has resolved. As soon as you return from an Async lambda, any promises that have not been resolved just get cancelled.
Awesome tutorial! Really helped my understanding of this AWS product. One quick question: Is there a specific reason that we are not compiling the code here with webpack?
In the serverless.yml file I use a plugin called serverless-webpack. This uses webpack behind the scenes. You can create a webpack config file in the root of your project and it will override the serverless default. Other things you can do is to add these two lines to your serverless.yml file. This will put all the code for each endpoint into a single file using webpack. package: individually: true
How does the lambda get billed? Normally it’s per request and compute time. Does it cost to keep the WebSocket connection open and how does server to client messaging get billed? Thanks!
It works exactly the same. Lambda is billed on invocations and compute time. This means of you have a high frequency websocket then it can get expensive quite quickly.
Hi, by following this tutorial i have managed to created everything that i need but the web socket trigger for lambda is missing. The policy that i have created has full permission. Any suggestions are much appreciated. Thanks
This isn't something I've seen before. Could you try re-deploying another stage and see if that also doesn't set up the lambda trigger. If that doesn't work, maybe check the permissions of the IAM user that you are using to deploy with?
Hi, thanks for the tutorial. I've one query. I'm working on a calling application. When one user starts a call to connect with some other user, only the other user will be get notified in the frontend app if the user is logged in. How can I achieve this with this WebSocket?
cool idea. You set the websockets up so that when a user connects, they are stored in some database with their websocket details. You have a method on the websocket for 'get all other users' which will tell you which users are also connected. You have a second method for 'request call' which will pass up the ID of the user that you want to connect to. This lambda will look the user up in the DB, find their websocket details and then send them a message. Depending on how you're doing the call part, if the user accepts the API could generate a callID and send it to both of the users.
The only ways I can think to send a parameter to the $connect lambda is through path parameters (not certain that it would work) or though query string parameters (definitely works). You can also set up custom websocket routes. You could set one up for auth or setup and pass the game ID in that request.
@@CompleteCoding I have the same question. path parameter would suit me best (wss://api.mydomain.com/dev/clientID). Can you guide me where to find the how? Less preferred, but if I have to, query string could help www://api.mydomain.com/dev?id=. Thanks! And in all honesty: I was able to run your whole demo from scratch. Not used VS code, serverless or anything near before. Only AWS GUI with your other video on REST calls via GateWay API. Many thanks!
Thanks for the great tutorial, it was really helpful. I was wondering if you know or had any ideas which is the best way to message an individual user based on their unique username? I'm having trouble as the user may have multiple tabs or devices open and I need the notification (that comes from an EC2 instance) to pop up on all of their connections. If you have time, any pointers would be great. Keep up the good work :)
You could look into SNS to fire events from the EC2. This could then hit a Lambda which send the messages back to the customer via websocket (for browser users) and SNS can integrate into mobile apps for native app notification.
Excellent tutorial, however I get error on connect when testing my sockets. Checked twice the entire process, no way to get it working. Deployment in AWS is fine and everything else looks ok.
Time for some debugging: Does your lambda get triggered - you should be able to see some logs from it if it has If Yes => something in the lambda may be causing the connection to fail If No => Look in API Gateway at the websocket. Make sure that the "onConnect" is pointing at the lambda. If not then fix that and retest.
is the browser client sending the connectionID? I'm not sure that's ideal if so. Shouldn't the server generate that? I see the API gateway is adding it, assuming you enable that.
API gateway generates the connectionID when a new client creates a websocket connection. You can re-use that in the Lambda to make sure you send messages back to the correct user
Hey Sam, thanks for this. Please I have an urgent question. Can AWS websocket be used in a laravel application to replace pusher. Basically for pusher you just require the keys and you're ready to go on a laravel app. Do you think that's possible with AWS websockets as well.
I've not worked with Lavarel before but it looks like other people have built pusher replacements with websockets. It should be able to build something to replace the functionality of pusher. Websockets can listen to the messages sent from the app and you can trigger messages be sent to the app when something else happens (message from other users, system change)
where will the HTTPS certificate be installed, will it be installed on API Gateway? I have wss based qraph query subscription, so how do I deploy this? my backed in on fargate and we cant have sidecards on the EKS on fargate, but i need to use wss
You've asked a few things here. Https cert - api gateway generates your a random base url with a cert. If you want a custom url then point route 53 to the api gateway url Graphql - I would use appsync any time I do graphql. That covers everything. Creating a custom graph ql subscription might be possible with api gateway websocket but it's going to be a lot more effort and complexity
If you try to do multiple clicks on the Connect button the Function creates two recconrds in DynamoDB. Can you explain if we need to handle it? Thank you for the hight quolity educational content!
If you click twice then you are creating two separate websockets. This is the same as two users connecting from two different computers. If you want to do something where you make sure that there is only one per user, you would need to send some details to the websocket saying who is connected. When you send that on the second websocket, it realises that it is the same user. You can then decide how to deal with that. You could close the original one or close the new one. Managing websockets in your app will be more complex than the logic I've shown here but how you do it depends on how it needs to work with your app.
Is there any way to debug your functions? I see that it's possible with Lambda through a REST protocol, but I can't find any help in how to do it with Lambda Sockets
There are a few ways. You can use serverless offline to run your websocket lambda locally and then test it as you would any other websocket, but you have the logs on your local machine. You should also be able to use a vs code debugger to add breakpoints and debug this way.
There are a few different ways to validate the schema in JS. You could write a function to manually test the properties on the payloads, or you could use something like YUP which is a JS schema validation package.
Thanks for this amazing video, nothing else like it on the net. I'm having an issue with sending a reply. It successfuly connects, sends and saves a message. However, it doesn't send or save the reply message. The code is literally copied and pasted from your github. Any idea why this could be?
So when the "customer" send a message they get the response but only the message they sent is saved in Dynamo? This is actually the way it was designed to work. If you want to add the saving of the response messages then messages.push(body.message); //2 new lines const responseMessage = "Whatever you want it to be" messages.push(responseMessage) const data = { ...record, messages, }; ... This will now have both sides of the conversation in the the messages array. You could make this better by doing something like this so you know who sent it in the future. messages.push({ user: 'customer', message: body.message}); const responseMessage = "Whatever you want it to be" messages.push({ user: 'bot', message: responseMessage});
@@CompleteCoding So when the "customer" send a message they get the response but only the message they sent is saved in Dynamo? First of all, thanks for the quick reply! As for the first q, no. They don't get the response. Yes the message they sent is saved to the database.
Hi, very nice tutorial thanks I have implement code from the start repo, every things are good but when I arrived at the websocket.send function to send back down message It's not work. I can't received the message like in your demo in websocket.org. So do you have idea for this problems please :)
I would add some logs around that function to make sure it is getting that far and see if the websocket.send is returning an error. It might be a config or a permission error.
how i can catch the response on the client of WS?, so i have a react app, and i need when the client is connected get the connection ID on the frontend, and the responses method used, i dont know how to work... thanks!
In the client you will do something like: const ws = new WebsocketClient( "YourWebsocketURL" ) ws.onMessage = (message) => { // code to do when you get a message } I hope this helps
Is there any way to know what kind of json event the lambda is invoked with? In other words, If I have the lambda running in an emulator and I POST an event with CURL, how would this json event look like?
You can use serverless-offline plugin to test your websocket APIs. That will send the correct messages to the correct lambdas, as it will happen when deployed.
@@CompleteCoding thanks. I can see it does not support dotnet runtime and I'm a C# developer. I managed to grab the payload from the logs in AWS console
I followed along and even copied a pasted but he message in the dynamoDB are not updating any idea what I can have set up wrong? I'm using the action for the message as well
First check that your message lambda is being triggered using cloudwatch logs. If it isn't then check the Route Selection Expression in API Gateway (should be $request.body.action 31:21 in the video) and check the messages you are sending down the websocket. If it is being triggered then check any of the messages for clues. You could add some more console.log events for details like the tableName and if there are any errors on the dynamo write. These should point you in the right direction
I know that it could be stupid but check if you haven't got any mistake in a WebSocket message: { "action": "message", "message": "hello!" }. I lost a quote -.-
Why would the code not reach that point? When we do await WebSocket.send({ ... }) this sends a message to the websocket but that doesn't end the function. You could have it do three WebSocket.send in a row and it would send three messages one after another. After it's sent the message it carries on to do the line you've pointed out.
can you please share, how can an api-gateway-websocket help to communicate via lex service , i.e. a chatbot which is reachable only for the authenticated users.
@@PrateekKumarS This will be a chunkier project. I need to work out how to set this up in a way that it doesn't become a 2 hour video. Also when you say "reachable only for the authenticated users", what do you mean?
This is the repo to start the lesson github.com/SamWSoftware/ServerlessUA-camSeries/tree/l13-clean This is the repo of the complete code github.com/SamWSoftware/ServerlessUA-camSeries/tree/l13-websocket-lambdas
The definition for the websocket endpoint is within the function event. Have a look at 22:00 onwards for configuring them. The only thing you have with websockets is routes.
Nice vid! Btw, Im getting this error when trying to send a message RECEIVED: {"message": "Internal server error", "connectionId":"DOGyae0NIAMCEZQ=", "requestId":"DOGzEFRtIAMFXzA="}
That probably means that the lambda that you are calling when you send a message is erroring. Have a look in the cloudwatch logs for the lambda and see why it is breaking.
I'm sorry I am completely new to Lambda in every single way and did not find this helpful at all... the video started in with a massive project already built. I don't even know what code editor is being used here.... The repository on git hub has like 3 files in the common folder and 3 in the root, which is nothing like what is seen in the video..... Is there a better tutorial out there with START to FINISH training that you know of?
If you are completely new to Lambda then I would start at the start of the playlist. This will teach you how to set up the Serverless Framework and deploy your first API. ua-cam.com/play/PLmexTtcbIn_gP8bpsUsHfv-58KsKPsGEo.html
What's the point of starting the video off with cleaning up the repo? It doesn't make any sense. We, the viewers, have no perspective of what is going on with the prior project. Just start it from a clean slate.
You can test a websocket lambda by calling the handler in the function directly. You pass in a know websocket event and then test what happens. You'll need to mock the websocket responses as you aren't actually sending messages to anyone.
Thank you!! I'm doing a demo tomorrow in my company on serverless and this was the only resource I found that explained the setup of websockets with API Gateway and Lambda so well. Finally, my demo is complete. Keep the amazing videos coming! :)
Glad it was helpful and I hope the demo went well.
These are literally the best coding instructional on the NET!!! Awesome you use the CLI for everything were as every of instructional use the GUI. If you subscribe and follow along you will not be disappointed. 10/10!!!!!!
Thanks Aaron!! It's amazing to get such good feedback.
Complete Coding You Da Man!!
Don’t change a thing!! 10/10!!
I’ve really been searching the depths of the net for such quality tutorials!! Everybody else’s videos take forever to get through because they use the GUI and explain other irrelevant stuff. Plus I use VS code. Let me know if I can help. Will be spreading the word about you videos!!
I'm still a student and this really really helps me a lot. Thank you!
Happy to help!
Dude, this is such a nice tutorial! I'm excited to see your other videos!
Thanks Rachelle, I'm really glad you found it useful
pro tip : you can watch movies on KaldroStream. Been using it for watching lots of of movies recently.
@Finn Callan yea, I've been watching on kaldrostream for years myself :)
@Finn Callan Definitely, I've been using kaldroStream for months myself :)
@Finn Callan yea, I've been using Kaldrostream for since december myself :D
Awesome tutorial.
It would be great if you add a section about integration of a costum authorizer for the $connect route
Great suggestion!
You absolute hero; really helpful and concise tutorial!
You're welcome!
I am thankful for your videos and they taught me so much . I had great experience on aws but i was not fan of serverless yaml file because of some small indentation it causes huge problem .However you made it so easy for me and i feel comfortable now to write api in serverless rather than deploying in console aws
Getting used to indent formatted code is strange coming from JavaScript but you get used to it. Glad you found it all helpful. Not having to go into the console makes things so much quicker
Excelent explanation. Thank you!!!
Glad it was helpful!
@@CompleteCoding Hey ! I would like to know how to set up the endpoints ? In sls deploy i am getting an error
Super well explained, thank you very much for such a nice piece of work!!
You're very welcome! Hope you build something cool with this
Very concise n clear, what makes next worth is to do Front-End full stack app with hybrid framework
Thanks Yasir. Great idea. I'm looking at doing a short series on building a full-stack product with serverless.
Thank you for making this video.
Glad it was helpful!
Nice production value. Great tutorial. Thank you.
Glad you enjoyed it!
Thank you!! There is a sight change in newer version regarding postParams. it should be like this "ConnectionId" with capital C
const postParams = {
Data: message,
ConnectionId: connectionID
}
Your explanations are so comprehensive and understandable! Sub
Thanks. I struggled to find really well explained things on serverless when I was learning so now I make those videos to fill the gap
Thank you for your excellent video.
You are very welcome!
Amazing tutorial. Its very easy to learn and use.....Good job
Glad you liked it
Nice tool, websocket.org, I usually use an npm package called wscat, where you can connect and test your socket connections in terminal on your local machine. Good tutorial, got some nice serverless tips for websockets here thanks.
Great tip! I use that when I'm developing wscat too. For this video it's easier just to show it on a browser.
Excellent video! Congratulations.
I found a typo in the code of the websocketMessage.js file. In connectionId, C is capitalized. The correct one would be ConnectionId in postParams object.
Great spot thanks. Unfortunately UA-cam doesn't let me update the video :/
@@CompleteCoding No problem. I'm watching all of your lambda videos. This gave me an incentive to learn how to use the cloudwatch and debug the code to find the source of the problem! lol
In general, my congratulations for the videos! They are excellent for people like me who are learning to use lambda.
Thanks Wagner, it means a lot to hear that you find them so helpful
An excellent and clear tutorial
Glad it was helpful!
Great tutorial!
What I find a bit weird in the code, that you use Responses._200({...}) as part of the websocket protocol. It looks like you're mixing HTTP and WS.
Great video thanks!!, I have a question is there any way to apply security restriction like a authorization or something to protect my wss endpoint with autorization method? Thanks
Yes, you can add the same authorisers as you can add to a normal API Gateway endpoint. This includes API Keys, cognito, or custom lambda authorisers
Great tutorial. I just have a quick question, is it possible to test locally without deploying these functions to aws lambda.? Afaik, y can use postman to test for the rest api, but not sure if we can use something to test for the websocket
Yes, absolutely. You can use "serverless-offline" plugin to run the whole API offline (including the websocket). This is great as it makes it really easy to tweak and update your code when you're building it. Here's a link to how to set it up
ua-cam.com/video/ul_85jfM0oo/v-deo.html
Very nice tutorial, good job :)
Thanks
it would be killer if this video could be reshoot using typescript
The main difference would just be adding a type to the event in the handlers
APIGatewayProxyWebsocketEventV2
please explain the configuration of aws and serverless framework and dynamo db
If you are having issues receiving a web socket reply, the postToConnection method parameter connectionId should be ConnectionId. With a capital ‘c’. The api may have been updated since this tutorial.
Thanks Bryon. This was a typo in the video that I missed. It's correct in the repo that is provided with the finished code.
Thanks Tom that was what I needed to finish
In your file message.js, when you do `const messages = record.messages`, you are referencing the same Array. So, when you do `message.push(body.message)`, you are in fact pushing also in the `record.messages`, so making the `data` with spread operator in front of the record, does not make sense, as you have the same data.
To create new Array of messages, you should use `const messages = [ ...record.messages ]`, then you will have the new Array without referencing the one in `record`.
Good point. The code could be reduced.
I really appreciate you dude, very nice tutorial. Just want to know what if i want to push message to all users not to a particular user.
I'm glad you liked the tutorial. If you want to send a message to a specific websocket then you just need to make sure that you are sending the message with the correct websocket ID. You should have one ID per connection so each message you send should just go to one websocket
Awesome tutorial... U Rock!
Thanks Jaber. Glad you liked the video
You way of explaining is simply superb!
I have a question - I would like to invoke an https endpoing from within the lambda, exposed on a websocket, using coinmarketcap-api node package. Though its a one liner code, it doesnt execute within the lambda - are there any restrictions that I need to configure for using this package on serverless/aws or are there any restrictions on AWS to connect with the external services ?
Thanks for your help in advance!
No, there are no restrictions by default. If you've installed the package and required it into the lambda then it should just work.
One thing with this is that the package uses promises. Just make sure that you're returning from the function after the promise has resolved. As soon as you return from an Async lambda, any promises that have not been resolved just get cancelled.
Awesome tutorial! Really helped my understanding of this AWS product. One quick question: Is there a specific reason that we are not compiling the code here with webpack?
In the serverless.yml file I use a plugin called serverless-webpack. This uses webpack behind the scenes. You can create a webpack config file in the root of your project and it will override the serverless default.
Other things you can do is to add these two lines to your serverless.yml file. This will put all the code for each endpoint into a single file using webpack.
package:
individually: true
@@CompleteCoding Thank you very much for the elaborated response. I tested it and saw it works with Websocket API aswell.
@@omersaar3864 Great to hear.:)
How does the lambda get billed? Normally it’s per request and compute time. Does it cost to keep the WebSocket connection open and how does server to client messaging get billed? Thanks!
It works exactly the same. Lambda is billed on invocations and compute time. This means of you have a high frequency websocket then it can get expensive quite quickly.
Hi, by following this tutorial i have managed to created everything that i need but the web socket trigger for lambda is missing. The policy that i have created has full permission. Any suggestions are much appreciated. Thanks
This isn't something I've seen before.
Could you try re-deploying another stage and see if that also doesn't set up the lambda trigger.
If that doesn't work, maybe check the permissions of the IAM user that you are using to deploy with?
Hi, thanks for the tutorial. I've one query. I'm working on a calling application. When one user starts a call to connect with some other user, only the other user will be get notified in the frontend app if the user is logged in. How can I achieve this with this WebSocket?
cool idea. You set the websockets up so that when a user connects, they are stored in some database with their websocket details.
You have a method on the websocket for 'get all other users' which will tell you which users are also connected.
You have a second method for 'request call' which will pass up the ID of the user that you want to connect to. This lambda will look the user up in the DB, find their websocket details and then send them a message.
Depending on how you're doing the call part, if the user accepts the API could generate a callID and send it to both of the users.
@@CompleteCoding Thank you so much! I'll try that out.
Hi, how about If I want to send a parameter (game_id) to $connect, which will be stored in dynamo for filtering later on ... Any idea ?
The only ways I can think to send a parameter to the $connect lambda is through path parameters (not certain that it would work) or though query string parameters (definitely works).
You can also set up custom websocket routes. You could set one up for auth or setup and pass the game ID in that request.
@@CompleteCoding I have the same question. path parameter would suit me best (wss://api.mydomain.com/dev/clientID). Can you guide me where to find the how? Less preferred, but if I have to, query string could help www://api.mydomain.com/dev?id=. Thanks! And in all honesty: I was able to run your whole demo from scratch. Not used VS code, serverless or anything near before. Only AWS GUI with your other video on REST calls via GateWay API. Many thanks!
Thanks for the great tutorial, it was really helpful. I was wondering if you know or had any ideas which is the best way to message an individual user based on their unique username? I'm having trouble as the user may have multiple tabs or devices open and I need the notification (that comes from an EC2 instance) to pop up on all of their connections. If you have time, any pointers would be great. Keep up the good work :)
You could look into SNS to fire events from the EC2. This could then hit a Lambda which send the messages back to the customer via websocket (for browser users) and SNS can integrate into mobile apps for native app notification.
Excellent tutorial, however I get error on connect when testing my sockets. Checked twice the entire process, no way to get it working. Deployment in AWS is fine and everything else looks ok.
Time for some debugging:
Does your lambda get triggered - you should be able to see some logs from it if it has
If Yes => something in the lambda may be causing the connection to fail
If No => Look in API Gateway at the websocket. Make sure that the "onConnect" is pointing at the lambda. If not then fix that and retest.
This is a good video, thanks!
Glad you liked it!
Thank you very much!!!
My pleasure
is the browser client sending the connectionID? I'm not sure that's ideal if so. Shouldn't the server generate that? I see the API gateway is adding it, assuming you enable that.
API gateway generates the connectionID when a new client creates a websocket connection. You can re-use that in the Lambda to make sure you send messages back to the correct user
Hey Sam, thanks for this. Please I have an urgent question. Can AWS websocket be used in a laravel application to replace pusher. Basically for pusher you just require the keys and you're ready to go on a laravel app. Do you think that's possible with AWS websockets as well.
I've not worked with Lavarel before but it looks like other people have built pusher replacements with websockets. It should be able to build something to replace the functionality of pusher. Websockets can listen to the messages sent from the app and you can trigger messages be sent to the app when something else happens (message from other users, system change)
Thanks a lot bro, I remember you were going to notify me when you upload this video. Anyways, great video!
Sorry about that! Glad you still enjoyed it
Hey ! I would like to know how to setup the endpoints ?
What error are you getting when you try and deploy?
where will the HTTPS certificate be installed, will it be installed on API Gateway? I have wss based qraph query subscription, so how do I deploy this? my backed in on fargate and we cant have sidecards on the EKS on fargate, but i need to use wss
You've asked a few things here.
Https cert - api gateway generates your a random base url with a cert. If you want a custom url then point route 53 to the api gateway url
Graphql - I would use appsync any time I do graphql. That covers everything. Creating a custom graph ql subscription might be possible with api gateway websocket but it's going to be a lot more effort and complexity
Thanks bro...
You're very welcome
If you try to do multiple clicks on the Connect button the Function creates two recconrds in DynamoDB. Can you explain if we need to handle it?
Thank you for the hight quolity educational content!
If you click twice then you are creating two separate websockets. This is the same as two users connecting from two different computers.
If you want to do something where you make sure that there is only one per user, you would need to send some details to the websocket saying who is connected. When you send that on the second websocket, it realises that it is the same user. You can then decide how to deal with that. You could close the original one or close the new one.
Managing websockets in your app will be more complex than the logic I've shown here but how you do it depends on how it needs to work with your app.
hey, great tutorial. which extensions are you using in Visual Studio Code?
Thanks Hans
GitLense, indent-rainbow and prettier are the ones that I use that affect functionality. The rest are themes or ones for other languages.
Thanks for making this video ! I'm getting following error: Error: Profile serverlessUser does not exist.
How to I create a serverlessUser profile ?
This is the bit that you want ua-cam.com/video/D5_FHbdsjRc/v-deo.html
Is there any way to debug your functions? I see that it's possible with Lambda through a REST protocol, but I can't find any help in how to do it with Lambda Sockets
There are a few ways. You can use serverless offline to run your websocket lambda locally and then test it as you would any other websocket, but you have the logs on your local machine.
You should also be able to use a vs code debugger to add breakpoints and debug this way.
What is the best approach to handle the schema of data payload in websocket?
There are a few different ways to validate the schema in JS. You could write a function to manually test the properties on the payloads, or you could use something like YUP which is a JS schema validation package.
Thanks a lot!
Glad you liked it
Thanks for this amazing video, nothing else like it on the net.
I'm having an issue with sending a reply. It successfuly connects, sends and saves a message. However, it doesn't send or save the reply message. The code is literally copied and pasted from your github. Any idea why this could be?
So when the "customer" send a message they get the response but only the message they sent is saved in Dynamo?
This is actually the way it was designed to work. If you want to add the saving of the response messages then
messages.push(body.message);
//2 new lines
const responseMessage = "Whatever you want it to be"
messages.push(responseMessage)
const data = {
...record,
messages,
};
...
This will now have both sides of the conversation in the the messages array.
You could make this better by doing something like this so you know who sent it in the future.
messages.push({ user: 'customer', message: body.message});
const responseMessage = "Whatever you want it to be"
messages.push({ user: 'bot', message: responseMessage});
@@CompleteCoding So when the "customer" send a message they get the response but only the message they sent is saved in Dynamo?
First of all, thanks for the quick reply!
As for the first q, no. They don't get the response. Yes the message they sent is saved to the database.
Hi, very nice tutorial thanks
I have implement code from the start repo, every things are good but when I arrived at the websocket.send function to send back down message It's not work.
I can't received the message like in your demo in websocket.org.
So do you have idea for this problems please :)
I would add some logs around that function to make sure it is getting that far and see if the websocket.send is returning an error.
It might be a config or a permission error.
Cool! Thanks!
No problem Jean
how i can catch the response on the client of WS?, so i have a react app, and i need when the client is connected get the connection ID on the frontend, and the responses method used, i dont know how to work... thanks!
In the client you will do something like:
const ws = new WebsocketClient( "YourWebsocketURL" )
ws.onMessage = (message) => {
// code to do when you get a message
}
I hope this helps
Is there any way to know what kind of json event the lambda is invoked with? In other words, If I have the lambda running in an emulator and I POST an event with CURL, how would this json event look like?
You can use serverless-offline plugin to test your websocket APIs. That will send the correct messages to the correct lambdas, as it will happen when deployed.
@@CompleteCoding thanks. I can see it does not support dotnet runtime and I'm a C# developer. I managed to grab the payload from the logs in AWS console
@@diegomartin3414 I'm a JS and Python developer so I don't know much about those issues. Glad you were able to get the payload from the console.
I followed along and even copied a pasted but he message in the dynamoDB are not updating any idea what I can have set up wrong? I'm using the action for the message as well
First check that your message lambda is being triggered using cloudwatch logs. If it isn't then check the Route Selection Expression in API Gateway (should be $request.body.action 31:21 in the video) and check the messages you are sending down the websocket.
If it is being triggered then check any of the messages for clues. You could add some more console.log events for details like the tableName and if there are any errors on the dynamo write. These should point you in the right direction
I know that it could be stupid but check if you haven't got any mistake in a WebSocket message: { "action": "message", "message": "hello!" }. I lost a quote -.-
return Responses._200({message: 'got a message'});
line 30 - is never going to re reachable?
Why would the code not reach that point? When we do
await WebSocket.send({ ... })
this sends a message to the websocket but that doesn't end the function. You could have it do three WebSocket.send in a row and it would send three messages one after another.
After it's sent the message it carries on to do the line you've pointed out.
can you please share, how can an api-gateway-websocket help to communicate via lex service , i.e. a chatbot which is reachable only for the authenticated users.
That's a great video idea
@@CompleteCoding please update whenever you make this, any plans on making one ?
@@PrateekKumarS This will be a chunkier project. I need to work out how to set this up in a way that it doesn't become a 2 hour video.
Also when you say "reachable only for the authenticated users", what do you mean?
@@CompleteCoding sorry for the late reply, I mean cognito integrated chatbot.
Great, can we have a git repo?
This is the repo to start the lesson
github.com/SamWSoftware/ServerlessUA-camSeries/tree/l13-clean
This is the repo of the complete code
github.com/SamWSoftware/ServerlessUA-camSeries/tree/l13-websocket-lambdas
I already implement Pusher (laravel.com/docs/8.x/broadcasting) in my project. But pusher price is too high. Can I make pusher using this process?
If the client always has an open websocket then yes. That is exactly what you can do with this.
Where do I found the definition of wss endpoint in serverless.yml?
The definition for the websocket endpoint is within the function event. Have a look at 22:00 onwards for configuring them. The only thing you have with websockets is routes.
Nice vid! Btw, Im getting this error when trying to send a message
RECEIVED: {"message": "Internal server error", "connectionId":"DOGyae0NIAMCEZQ=", "requestId":"DOGzEFRtIAMFXzA="}
That probably means that the lambda that you are calling when you send a message is erroring.
Have a look in the cloudwatch logs for the lambda and see why it is breaking.
I'm sorry I am completely new to Lambda in every single way and did not find this helpful at all... the video started in with a massive project already built. I don't even know what code editor is being used here.... The repository on git hub has like 3 files in the common folder and 3 in the root, which is nothing like what is seen in the video..... Is there a better tutorial out there with START to FINISH training that you know of?
If you are completely new to Lambda then I would start at the start of the playlist. This will teach you how to set up the Serverless Framework and deploy your first API.
ua-cam.com/play/PLmexTtcbIn_gP8bpsUsHfv-58KsKPsGEo.html
What's the point of starting the video off with cleaning up the repo? It doesn't make any sense. We, the viewers, have no perspective of what is going on with the prior project. Just start it from a clean slate.
This is one video in a series. I've since done what you've said and start each video with a basic serverless project.
How can I do the unit testing with año web sockets ? Idk how test thst events
You can test a websocket lambda by calling the handler in the function directly. You pass in a know websocket event and then test what happens.
You'll need to mock the websocket responses as you aren't actually sending messages to anyone.