How to Use WebSockets in Unreal Engine

Download Core to create games for FREE: bit.ly/Core-Flopperam
Join the Game Creator Challenge: itch.io/jam/gcc
In this video, we go over how to use the WebSockets module in an Unreal Engine game. The WebSockets module includes only client functionality. Therefore, we use the module to establish a connection between Unreal clients and a sample NodeJS server, send and receive messages over that connection, and close that connection. Since the WebSockets module is not natively exposed to blueprints, we wrote some C++ code in the GameInstance and Character classes in order to not only connect to and disconnect from a server but also send messages to the server and implement event handlers in the IWebSocket interface. At the end of the video, we test multiple packaged clients simultaneously by having them all connect to the same server and send messages to each other via WebSockets.
****IMPORTANT LINKS****
More information about the WebSocket protocol: en.wikipedia.org/wiki/WebSocket
Unreal Engine project code that was used in this video: github.com/chris-gong/websock...
Node.js WebSocket server code that was used in this video: github.com/chris-gong/ws-serv...
Download and install NodeJs: nodejs.org/en/download/
Download and install Git: git-scm.com/downloads
How to expose C++ code to blueprints: docs.unrealengine.com/4.27/en...
Cool things you can make with WebSocket: / 10-most-amazing-use-ca...
Unreal Engine API Reference for the WebSockets module: docs.unrealengine.com/en-US/A...
****IMPORTANT COMMANDS****
cd [directory-path]
cd "[path-with-spaces]"
git clone github.com/chris-gong/ws-serv...
npm install
node server
To end the server: Ctrl-C
Windows: cls
Linux: clear
WebSocketTest.exe -WINDOWED
To fit make a window to take up either half or a quarter of the screen on Windows: Windows key + any arrow key
How to support the channel:
Get a shirt or sweatshirt with free shipping (Use code "SHIP" at checkout): teespring.com/stores/flopperam
Become a member: / @flopperam
Support us on Patreon: / flopperam
Donate to our PayPal: www.paypal.me/flopperam
Sponsor us on Github: github.com/sponsors/chris-gong
Social media links:
Discord: / discord
Twitter: / flopperam
Instagram: / flopperam
Facebook: / flopperam
0:00 Intro
1:09 Sponsor
2:33 Creating a WebSocket connection
10:04 Adding WebSocket event handlers
14:34 Sending data from client to server
18:10 Testing with multiple packaged clients simultaneously
20:40 Outro
#unrealengine #websocket #ue5

[@Flopperam]

Special thanks to our sponsor for today's video, Core! Please show them some love by downloading the game here, bit.ly/Core-Flopperam, and joining the Game Creator Challenge, itch.io/jam/gcc

[@EvanSisson]

Absolutely fantastic tutorial, from usefulness, teaching, and documentation!

[@user-gl6jw1zt2j]

Very useful. I followed it fully. The Keypress events used from 14:43 seems like deprecated in UE5.1. I used keypress event in the Blueprint to test after that. Also, I created WebSocket server in C++ using Boost libraries. It was needed for my work. NodeJS server works fine as well. The pace and delivery of instructions of this video are top notch. Thank you again.

[@sumiteshnaithani929]

Nice and lucid explanation

[@rickfuzzy]

Brilliant tutorial

[@mohammadalaaelghamry8010]

Great video. Thank you.

[@bioblazepayne]

Good information ~

[@threedai]

very nice !

[@p3ngine]

Anyone who's stuck at 09:35 - make sure while building the code your game window is not open, I had this situation and was not able to connect to the server since the code was not getting built in first place.

[@artoriasdenostradamus3628]

Congratulations and great tutorial , could you do a playfab , Photon, Firebase or whatever tutorial with UE4 C++ ?

[@Flopperam]

Yes, currently looking into PlayFab and Firebase. Not sure about Photon atm.

[@il4w]

Awesome tut! How can we send messages from the server to a specific client I assume we would use the client ID but does the websocket at server end allow to send messages to specific connected clients on the server's websocket? Or will it always be a broadcast and we can then filter out whether we want to use that message or not at the client end ?

[@Flopperam]

Hey sorry for the late reply, but basically the latter of what you just said. You'll have to make some custom logic to filter out on the client end. I could be wrong but I don't think there is an alternative to broadcast.

[@blakedellinger5300]

Great tutorial thank you!!! I'm stuck at the steps at 09:35 mins. I've followed everything thus far, my server is running locally and I pressed play in the engine. I'm not getting the "connected clients: 1" prompt. It's running the game but not the connection. I'm on UE 4.27.22. Would appreciate any advice on what could be going wrong with the connection!

[@blakedellinger5300]

Nevermind! I took a look at your code on github and I had a typo of course. You rock! One of the clearest and best documented tutorials I've come across. Instant like and subscribe. Thank you for this.

[@naveennirban]

Please post the error. Secondly, 1. Check whether you have installed the nodejs or not. 2. Whether all packages are installed or not. 3. Maybe some other service has occupied that port.

[@DrR0bot]

Hey! thanks for this video. The question, how would you pass the server message on to the engine to make use of it in Blueprints? Lets say at 13:04 minutes, I want to pass MessageString to a variable that later can be picked up by any actor in their blueprint.

[@Flopperam]

Hey, you could define a function with a BlueprintImplementableEvent ufunction specifier in the header file, implement the function in blueprints, and call that function in the lambda that's added to the event handler. Let me know if you have any further questions.

[@Flopperam]

Just to clarify, you should create a delegate, bind the blueprint function to the delegate in the constructor, and then execute the delegate in the lambda while passing the message string parameter. Here's a link with more info, docs.unrealengine.com/5.0/en-US/delegates-and-lamba-functions-in-unreal-engine/.

[@muller_digital]

@@Flopperamhey, So im a bit stuck on this. and was hoping you could help with this I need to receive messages from the server, then analyse that payload and store in variables in the gameinstance class. which I will include in a sublass actor to send data again. I declared a delagete (messagedelegate) in the gameinstance.h file and I have a public function (savemessage(&Fstring Jsonstring) I want to bind that function to that delegate, Im a bit confused on how to bind that delegate, and then call it in the onmessage event. Thank you so much for amazing tutorial!

[@Flopperam]

Hey sorry for the late response, have you tried calling the Bind function on the delegate? MyDelegate.Bind(&UCustomGameInstance::MyFunction) And then in your onmessageevent function, just do MyDelegate.Execute(Jsonstring) Hope that helps

[@muller_digital]

@@Flopperam hey no problem! Im very thankfull for you replying. Thanks for the advise. I will give it a shot.

[@arjunc5896]

Hi, I am really into learning UE now and would like to know if you can give me an idea on storing player id and other player details inside gameinstance class so that they persist across levels.

[@seventfour9247]

do I need a webserver for this to work? I want to build a small browser app to collect data from the engine and to trigger events in the engine at runtime. getting confused with the terminology here. I want it only on locahost or LAN, no transmission about the internet is intended.

[@jasonsimonsen4184]

Websockets are used generally to maintain state when you have multiple users and you want each of those users to interact in some way. NodeJS is probably the easiest to configure to use websockets. It all depends what you really want to do. If you wanted to collect data, you could create a websocket and send that data off to your server, and in this case depending if it is for benchmarking, you could have this server live on a different box. The reason why I say that is that then, you could have that box process the data and it would not impact the running of your game by consuming resources. Websockets are pretty light weight, they will have a slight impact, but again it depends on what you want it to do.

[@denvinogradov5765]

Excellent tutorial! Very simple and good step by stap explanation. I stuck just with one problem. My UE4 WebSocket client did not fire onMessage method. All other methods works as expected including sending messages to server. I saw received messages on server console, connect and disconnest server and all these debug messages shown on UE editor screen. But when serverBroadcast fired on server I did not see any errors on server side but any debug messages on UE did not appear too. My method looks similar WebSocket->OnMessage().AddLambda([](const FString& MessageString) { GEngine->AddOnScreenDebugMessage(-1, 15.0f, FColor::Cyan, "Message : "+ MessageString); }); I try catch any broadcasting errors like this client.send(message, (err) => { if (err !== undefined) console.log(err); }); err always is undefined UE 4.27.2 node v16.13.2 main difference with example project is UE Puzzle Template instead of First Person

[@Flopperam]

Hmm, this is very odd. So the callback function for serverbroadcast is getting called on the nodejs end but the unreal client's websocket onmessage callback isn't getting called?

[@denvinogradov5765]

@@Flopperam Exactly. I installed WebSocket Blueprint Plugin on same project and set it up to the same server. And Blueprints works fine. Client recieving messages from server and show debug messages on screen. But c++ method did not want to do the same things.

[@Flopperam]

Very odd

[@kikos055]

This happened to me too when i was binding events after calling Connect().

[@keithtang3306]

Seems to be happening to me too. Executed the send function on nodejs but nothing is fired in unreal on the onMessage method

[@aznurdemordis1854]

i good job but I try to make the code work in "wss" and it does not work with the client (of course I have modified the server code so that it manages the wss) on a browser my javascript client code connects to the server in wss but not connected with EU client I specify that I created a certificate for the occasion with "letsencrypt" is not a self signed certificate have you try to conect with wss?

[@Flopperam]

Hey, I have. What is the exact error you're getting?

[@romankupkovic]

Following every step there are compile errors with UE5.2.1 in files like `BulkData.h` and `PackedObjectRef.h` and errors "class 'UObject' doesnt have Member "Init"/"Shutdown" " Should this compile exactly as it does for you if project is created fresh like in the tutorial?

[@Flopperam]

Hey, sorry for the late response but yes I believe so. Are you modifying an existing project?

[@vonnblagaming984]

Good day is there a way to get a response from the OnConnected Event? I always get an error in the tuple

[@Flopperam]

Hey, what error are you getting? That event handler should fire every time there's a new connection created.

[@vonnblagaming984]

@@Flopperam Its okay now, I just needed to add the OnMessage Event, I wanted to get the response from the OnConnected Event. I was thinking add a return from the Lambda, but it doesn't work.

[@sinaasadiyan]

Do you know any tutorial to stream audio generated in UE5 to a localhost ip server ?

[@Flopperam]

I do not sadly. I think for that you may have to look at external solutions like vivox for example.

[@yadhuvtk]

Can I build own game server like Gamelift/ playfab with node js ?

[@Flopperam]

I know with gamelift, there's something called real-time servers that can be coded with JavaScript.

[@seventfour9247]

So Unreal hosts by itself a WebSocket server that can connect to another websocket server. Is a webSocket server necessarily a webserver?

[@Flopperam]

For this video, you need a separate WebSocket server, independent of Unreal Engine. The editor does, however, have a remote control API that lets an external program call it to control the editor. You can check here for more info on that, docs.unrealengine.com/en-US/ProductionPipelines/ScriptingAndAutomation/WebControl/RemoteControlAPIWebsocketReference/, so that may help if I understood your other comment. This video is more about communication between packaged Unreal Engine game clients and external WebSocket servers, whereas the link is about letting programs communicate with the engine/editor remotely. Hope that helps.

[@TheLord7even]

For days I'm trying to connect my Android phone to the PC. I tried several TCP socket plugins from the marketplace, wrote my own code and also with this nice tutorial about Web sockets, it doesn't work. It works (TCP and Web sockets) with laptops but Android seams to have some issues. Do we need to enable something specific for Android besides the internet and network permissions?

[@Flopperam]

Hey, what error are you getting when trying to connect to the WebSocket from an Android device?

[@Flopperam]

My guess is that perhaps your Android device is blocking the port being used for a WebSocket connection, so it may have to be enabled through the network configuration, developer.android.com/training/articles/security-config

[@TheLord7even]

@@Flopperam I'll probably have to code your full tutorial to answer that question. With a TCP socket plugin I used, there was no error or at least I couldn't track it. The plugin fires a disconnect or failure event but that doesn't get triggered at all on Android. So I assumed that the UEs socket code does not work on Android. (on windows everything works fine). I'll check it out later.

[@TheLord7even]

@@Flopperam Thanks for the fast reply. I'll check it out when I have time. Could be the solution. I'll let you know, it fixes it.

[@TheLord7even]

@@Flopperam the network config file also didn't work. testet with a few servers. I also checked out a unity tutorial: same results. It must be the "stupid"-phones even they are on android 9 and higher. There is no error just no connection. No warnings or such in the logs.

[@chadgtr34]

is this a good choice for Multiplayer Racing Game ?

[@Flopperam]

I think so yes, but there are other options like dedicated servers and streaming that could be better.

[@BDobbs-sk9hf]

Great tutorial and explained a lot; however, I'm stuck at trying to connect to the localhost websocket. I've traced the issue to be breaking from a callback from the lws library which seems to imply it could not complete the handshake. It breaks on case LWS_CALLBACK_CLIENT_CONNECTION_ERROR (UE5, LwsWebSocket.cpp:422). The close reason only says 'invalid' and for the life of me I can't figure out why. I followed the tutorial exactly with the exception of changing the port because my 8080 is being used for something else. Any advice?

[@Flopperam]

Are you running the nodejs websocket server code and the unreal client locally?

[@BDobbs-sk9hf]

@@Flopperam Hey, thanks for the quick response. Yes, both are being run locally.

[@Flopperam]

Is it possible to use port 8080 just to test?

[@BDobbs-sk9hf]

@@Flopperam I was able to use both port 8080 and the previous port I was using on a different machine. I think there is something going on with the machine I was originally using.

[@BDobbs-sk9hf]

@@Flopperam I figured out the issue was with the proxy I was using for some reason 🤷

[@niltoncostajunior9508]

Hey. Can WebSockets be used for web browser multiplayer? How to make a multiplayer game running in the browser? since there is no download of the client? Could you do a tutorial on this please? There is nothing on the internet on the subject. I just found how to package a game for html5 using version 4.23 of UE4.

[@Flopperam]

Yes, webspckets can be used for web browser multiplayer. With regards to HTML, I believe for newer versions of unreal, streaming is the recommended approach for web based games. We'll probably make a tutorial on this.

[@niltoncostajunior9508]

@@Flopperam Thank you so much! 🥰

[@gavrielcohen7606]

Is it now possible to accomplish this in a blueprints project in UE5?

[@Flopperam]

Yes, you would have to make a blueprint function via c++ though

[@nipunjain1142]

If suppose 3 people have been joined in the server....So they would not able to see each other avatar in the game?? I wanted to ask In this way can we able to make multi-player game??

[@Flopperam]

This is a web socket server. You're thinking of a dedicated server

[@muller_digital]

my code says GetGameInstance() is not defined.. all the headers are in any idea?

[@Flopperam]

Hmmm, what class is this method being called in?

[@muller_digital]

@@Flopperam hey man tnx for the reply. Turns out it was cause i was trying to call it in a component class..which in hind sight doesnt make much sense.. I changed over to an actor to send data to server and it seems to work with your project. Thank you so much

[@gnaniification]

Can you please suggest how to use on message data into my character move forward method

[@Flopperam]

Hmmm, is there anything specific you're looking for? I guess what troubles are you having while trying to achieve this?

[@madhukar_b]

@@Flopperam Thanks for your fast reply, Actually our idea is to call MoveForward method(Chracterclass) based on the message recieved from Onmessage(Websocketclass)

[@Flopperam]

@@madhukar_b is this a turn based game? or are you trying to have the actual pawn movement dictated by the websocket data?

[@gnaniification]

@@Flopperam pawn movement based on websocket data can you please

[@Flopperam]

I think for that you're better off looking into streaming. Otherwise, if you really want to use websockets for that, then maybe delegates or threads could help.

[@OniroStudio.]

How can i disable the certificate validation in ssl?

[@Flopperam]

That I'm not too sure how to go about sadly.

[@mikealmogy]

What does WebSockets gives you that unreal server does not?

[@Flopperam]

Hey sorry for the late reply, but it's moreso that a way to offload stuff off your main unreal server to something else.

[@snacks2734]

so this is basically a game-engine web-hook?

[@Flopperam]

I believe so, yes.

[@dwanyeeast8614]

First off, great tutorial! I'm stuck at 9:06, installing the git and running the node server. I get a few errors like no repository field, no license files, and crypto module does not export "randomUUID". Anyone have a solution for this?

[@Flopperam]

Hey could you post a screenshot of your errors?

[@dwanyeeast8614]

@@Flopperam drive.google.com/file/d/1HxyTAXRY1321Ki4xjbjTtO28n6BSwuNU/view?usp=sharing

[@dwanyeeast8614]

@@Flopperam I updated Nodejs and wasn't getting the no directory field and no license field error, but as you can see, the randomUUID persists. I was reading up on it, and I saw a lot of mentions about adding "type": "module" to fix the error, but it already exists, so I'm confused what the error is.

[@Flopperam]

@@dwanyeeast8614 I'm assuming you ran npm install?

[@dwanyeeast8614]

@@Flopperam I did. Got the latest. Anyways, a friend of mine got it sorted out. Thanks for looking into to it. I look forward to future Videos.

[@matheorose1113]

OMG

[@user-bz6ib9ih4i]

F it dont working