C# Client/Server WebSocket Application in ASP.Net Core | Visual Studio

hello everyone welcome back once again in this video we'll look at a client server websockets application in csharp and asp.net core used in the visual studio 2019 but before we get started please make sure you subscribe to the channel if you haven't so let's get to it then so websocket provides full duplex communication channel between a client endpoint and a service endpoint over a single tcp connection so enough we'll load that so to actually get started obviously as you can see you're going to have the you need the virtual studio 2019 installed and it.net call workloads as well so once you've got that bit sorted out then you open the visual studio 2019 and then create a new project yeah so here um actually what i'm gonna do i've actually got a blank solution created so i'm just gonna click on the solution and add a new project so what i'm gonna do is i'm i'm going to add a so here we're going to select the asp.net called empty so we select the m the blank project we click on the nest so here we can actually configure uh the project details so we could just call it uh ws.server just say websocket.server so click on the next so here we can actually configure the project details so here what we do is we just gonna uncheck the configure for https and then we're just gonna leave the rest as it is so we click on the create and it should take a while so i'm just gonna pause the video so as you can see here now we've actually got a project created not to waste too much time we're just gonna jump in straight away so if you're familiar with asp.net core project then you know i don't have to explain anything we just have to click on the startup.cs yeah and this is what we're actually going to put inside the startup.cs we're going to scroll down so right after the the app door using up dot user routing you see up the end point use this endpoint so we're just going to remove these endpoints right yeah so we're just gonna um collapse this configure as well and that is what we're going to do we're going to add a new method and this will be a private async task and we're going to call this send so this method will take in um http contest so this will be the contest and then it will also take in the websocket yeah so the websocket this should be under the system.net so we reference that system.net.websocket yeah so we're just going to call this websocket as well yeah so this is the method that we created for now so we come inside the configure so right after the app dot use routing this is what we're going to do first we start a variable and this variable we're going to call it ws options for web sockets options yeah and this will be equal to a new websocket options so this is what we actually put out there so keep live keep alive interval we set that one to time span dot from seconds so are we just going to set that to 120 seconds yeah and then app dot use websockets so inside we're just going to put a ws options yeah that's what we're going to do for now so the next part is up the used method so here we're going to put this async so we're going to put our first a contest and the nest so this is what we're going to put inside here so we check if the contest dot request dot path um is equal to our contains here some forward slash send this is what we're going to do we're going to check if the contest dot web sockets dot is a web socket request so we check if it's also a web socket request and then this is what we're going to do you use the user keyword and then the websocket this one will be our websocket this will be equal to await a contest dot websockets dot accept websocket async so it is what we're actually going to do we're going to await the send method that we actually created then we're going to pass in the contest and then the web socket yeah so now what we do is we come inside the same method that we just created but before we do that so right after that that if the contest this this part yeah uh now right after that this the contents of websockets that is it's a request we put the else statements yeah so if that's not the case then we can set a contest that responds we say the contest response status code so this would be http status code so here we can you use system.net dot bad request so if the request is not obviously if it's not a websocket request then we we actually return a bad request right so we come back to the send method right so here this is what we're going to do we initialize the variable buffer so we set that to a byte array which will be 1024 by four then the next is we set a web socket receive resource this will be our results it will be equal to await the websocket dot receive async yeah so in here this is where you're going to put a new array segment takes in the bytes and then our buffer then report our system dot threading dot cancellation token dot none yeah so that's all we're going to put for here now so next is we actually check if the result is in now the resource isn't empty if that isn't the case then we will use this while loop so it will be resource the closed status that has value so if this is the case this if this isn't the case actually then we set this variable string msg for message will be equal to encoding so this will be system.test i suppose yeah encoding dot utf-8 dot get string so this will be a new array segment byte this will actually take our buffer and then the offset 0 then resource dot count yeah okay so there's one mistake here i remove this bracket and then you close you close it here okay so now we could actually say console.writeline um uh the client says that we can actually print out a message so what we do next is actually await websocket dot send async so here this is what we're going to do we're going to send a message to the client but with the response to the client so this is what we're going to do we set the new arrow segment so here in here this is what we're going to do encoding dot utf-8 dot get bytes so we're going to convert this test so we're going to say that the server says so this is just a message from the server so we're just gonna print put a daytime here that's all we're gonna do for here now so here after this we come inside here then we put a resource dot message type and then results dot end message and then system no threading dot cancellation token.none yeah so that's all we're gonna put for here now as you can see it's not very difficult so what we do next is we set the the results to await uh websocket dot receive so this is what we're going to receive from the client i mean yeah from the client it's a new error segment so this will be our buffer and then our cancellation token so system.threading dot cancellation token.none yeah so as you can see here it's not it's not very difficult so we could say console.rightline results uh we're just gonna and we're just gonna comment on this bit for now yeah so the last part is right after the if the result isn't i mean it's not now this is what we're going to await uh websocket dot closed async so this was going to pass in results dot close to us dot hash value result dot close data description then system dot thread in the cancellation token.none yeah so this is all we're going to do here for the service now yeah that value is that not has value dot value instead yeah then so now as you can see now it's not it's not very difficult so this is how we can run it yeah we can either run it on iss express or we just run it as an executable so we f5 so now as you can see we've actually got that the web server is running now yeah our our websocket service running now so the next part is obviously we click we actually create the cr the client so we stop it from running right click on the solution then add new project so here we add a new console app right click ok so we could just say ws dot client it's not necessarily important but obviously let's do it that way so what we do is inside this cons inside our client we right click it and then manage new get package so we actually is browse and we're going to add click on the web we add i mean type websockets yeah so we add the system.net.websocket.client so we add all these dependencies and we accept all the lines and stuff so as you can see here now we've got it installed so we can close the new get package now and just start so here is the instead of the hello world we're just gonna type um press enter to continue so we put console.rely so this is what we're going to do next obviously i'm going to start with a using keyword and then a client websocket a client websocket so we just check here so it's inside the system.net.websocket the one that we've actually just created yeah so as you can see here now we've got it referenced so we're just going to call this one a client it will be equal to the new instance of the client's web socket yeah then we have a variable or uri so we're just gonna call this service uri so this will be a new uri so inside here this is what we're actually going to put in ws colon two for slashes localhost column five thousand column and then the send in this i will explain later if we look at the the start of cs we actually specified it here so we will be actually tracking this end so once we've got this bit sorted out the next is obviously we initialize a new variable and this one we call it cts this will be a cancellation token source yeah this will be a new cancellation talking source so we look at it here and this should be under system.threading yeah so you see the error gone now so the next part is we we say yeah cts c ts cts dot cancel after so we set up to the time span dot from seconds so we set that to 120 seconds yeah then we put the rest inside the try catch block so the exception will be a websocket exception so we're just gonna print out any error or any unforeseen circumstances that actually pops out yeah so we're just going to bring the message so inside the try block yeah this is what we're actually going to do we await the clients not connect anything so we await the connection yeah so we put our service uri and our token so c cts dot token so what one thing we have to do is instead of the the main method here we change it to to to task yeah instead of to use task yeah instead of um the void so it's going to be static async task yeah so now we can await the service.connect async here so what we do next is we put a variable n for a number we're just going to initialize that to zero and then right after it we will we start this loop yeah so while client dot state is websocketstate.open so and then we're just going to leave it here like that so what we do what we do is after this yeah is we're just gonna put a console.rightline and say enter message to send so we say string message is equal to console.reline yeah so now we've got the message so we just check if the variable message actually contains something a test so if that's actually the case then this is what we're going to do we start with an array segment variable arrow segments bytes and we're going to call this byte to send and this will be equal to new arrow segments so here this is what we're going to do so here inside here this is what we're going to do encoding we're going to put an encoding encoding which is under system.test dot utf dot gets get bytes so here we put in the message so we're going to convert the message into bytes then we await our client dot send so we actually send it to the server to the server so uh byte to send and then websocket message type so this test we're going to send it as test and then true and then our cts our token.token so this is what we're going to do next we start with this variable this will be our response our response buffer this will be a new byte array that we initialize with 1024 and then a variable our offset variable we set that to zero and then our variable so this will be our packet size we're just going to name it just a packet so we're just going to also set that one to 1024 and then we put inside a while loop here so while true so this is what we're actually going to do next so first set this variable every segment byte so this will be a bite to receive received this will be a new array segment so this is what we're going to put inside so the response buffer the offset and then our pocket so websocket receive results this will be our response this will be equal to await client dot receive async so this will be our byte received and then our cts token and then variable this will be a response message so this will be the incoming message from there from the service so this will be an encoding dot utf-8 dot get string so our response buffer offset and then response dot count so we're going to we can write it here our response message here and then we can check if a response the end message so if the incoming response is end message then we can break the loop so as you can see it's not very difficult so i'm i'm just going to run it to see what actually comes out of it right so after all after all of this yeah inside is using this stuff here i'm just gonna put a console dot a red line here obviously to prevent it from closing yeah so what i'm going to do is just right click on the solution and then i'm set to start projects yeah so here we set that to multiple and then we actually push the server forward to start first then we set this part here start here and then it starts here so we apply the changes and then we f5 or click here so as you can see we've got this be changed to multiple projects so as you can see here now we've actually got the service started and then if we press enter here we should get now we should get the commission i mean the connection established so if we say hello here let's see what we send hello here so as you can see here we've got the service i mean the the message received by the service and then as you can see here now we've got the server replied so as you can see it's not very difficult but obviously this actually took a while though but i hope you got the whole thing and you can explore this favor yourself so once again i'm just going to leave the video here so if you haven't subscribed to the channel please make sure you do because i've got lots of videos coming up and i hope you have a lovely morning evening afternoon wherever you are bless and peace bye

Channel: Hacked

Views: 61,133

Keywords: c#, websockets, websocket, learn c#, c# tutorial, c# programming, c# websocket, visual studio websocket, client/server websocket, websocket app, asp.net core websocket, signalr websocket, real time app websocket, websocket tcp, c# websocket console app, c# web service, .net microservices, grpc websocket, websocket streaming, coding

Id: gDdPGI1c6ro

Length: 30min 29sec (1829 seconds)

Published: Mon Jun 07 2021