[Plugin] Socket.io Client

[getnamo]

Socket.io is a performant real-time bi-directional communication library. There are two parts, the server written in node.js and the client typically javascript for the web. There are alternative client implementations and I've used the C++ client library and ported it to UE4.

For the London is Unreal meetup I made a presentation on the topic of plugins and chose to implement a useful plugin live during the presentation. A socket.io client was chosen as the plugin, which was finished with a basic Connect, Bind, Emit functions and an On event all interfaced through an Actor Component.

Since 0.4, the plugin is pretty feature complete, let me know what other features you think are missing!

Contribute
Currently missing static libs for various platforms see https://github.com/getnamo/socketio-client-ue4/issues

Download

Available at: https://github.com/getnamo/socketio-client-ue4/releases

Resources
Github Repository - Always contains the latest documentation
Example UMG Chat Project (contains server and both web and ue4 client)
How to connect Unreal Engine 4 to local server via WebSocket using blueprints? - By Egor Bogomyakov

Example project is a functional UMG based chat window place in world showing real-time communication ability of UE4 -> Web/Mobile


Quick Install & Setup

1. Download Latest Release
2. Create new or choose project.
3. Browse to your project folder (typically found at Documents/Unreal Project/{Your Project Root})
4. Copy *Plugins* folder into your Project root.
5. Restart the Editor and open your project again. Plugin is now ready to use.


How to use - BP Basics

Add the SocketIO Client Component to your blueprint actor of choice



Specify your address and port, defaults to localhost (127.0.0.1) at port 3000. Note that since 0.2.0 connect is optional as the component will auto connect unless you disable autoconnect via boolean.



Call bind for each event you wish the client to subscribe, e.g. 'chat message'. If you expect to receive events, select your component and in the Details pane press the + to add an 'OnEvent' event to your event graph.

Handle this event for your event types, e.g. printing 'chat message' event strings.



If you want to send information to the server, emit events on the SocketIO Client Component, e.g. pressing M to emit a 'chat message' string



Changelist

See latest changes at https://github.com/getnamo/socketio-client-ue4/releases

0.7.0
-Compile fixes for 4.18
-New Plugin scoped memory architecture for reliable and fast FSocketIONative management. Candidate fixes for #44, #45, #55, #56, #57, #60, and #63. If you were having any of those problems, try the new plugin and give it a good test. Re-open if issues persist. Architecture merged in as f17df08
-New optional fully plugin-scoped connections which remain even through level transitions. Tick bPluginScopedConnection true and ensure your component before and after use the same PluginScopedId. Unless disconnect is manually called these type of connections will only close on app exit.
-New OnConnectionProblems callback with verbose signature allowing you to detect when you get disconnected while the socket.io client is still trying to reconnect (default: always trying infinite times). If you wish to change this behavior new parameters have been exposed which control connection attempts and delay.
-New default toggle bVerboseConnectionLog allows you to quiet your log. Default is true.
-Blueprint TMap support added! This should be a massive boost to productivity if you used map like data structures. Issue #59 fix merged in f640f63
-Auto-conversion for As String if string type not supplied. Issue #64 merged in 2b118c4
-Direct convenience function binds added. This allows you to bind an event or callback to a blueprint function with e.g. String signature only if you know the data type will be a string. See emit with callback section for a list of supported signatures. Issue #65 fix merged in 591c150
-FSocketIONative now exposed as API. Issue #66 merged in 7e32f70 spotted by GeneralD

0.6.0
-Rebased to accomodate #43. You can now put FSocketIONative anywhere with your own allocation structure.
-'On' event dispatch changed to 'OnEvent'.
-Candidate fixes for #41, #32, and #38
-Fixes to underlying library stopping re connection attempts when you close a connection: getnamo/socket.io-client-cpp@3f0cd99

0.5.2
-Fixed boolean always returning false #35

0.5.1
-Fixed undefined as second emit parameter from server #36

0.5.0
-Fixes for disconnecting while communicating with an unreachable server #32
-Boost updated to 1.62
-Socket.io-cpp updated to latest master merge
-misc internal features for tracking and killing lambda threads

0.4.8
-UTF8 Support
-Connection fixes
-Session ID fix
-Compile fixes for IWYU changes in 4.15
-Scaffolds for other platforms from contributors (non-functioning)

0.4.0
-Added SIOJson for Blueprint Json construction and conversion, based on VaRest
-Auto-conversion for nodes
-Blueprint callbacks and events bound to functions references by function name
-Conversion of JsonObjects to and from UStructs, including Blueprint UStructs with automatically trimmed long names into readable short names
-Overloaded EmitNative for all expect UE native data types
-Much simplified C++ usage based on FJsonValue and FJsonObject including nested binary support (hackery!)
-and much more

0.2.6-0.3.4
-Internal versions for 0.4.0

0.2.5
-Change event names and signatures
-Add wider support for raw message emitting and receiving

0.2.2-0.2.4
-raw sio::message support and events

0.2.1
-added proper binary send/receive support
-added functioning onconnect/disconnect events, no longer require
special events on your server
-added on namespace connect/disconnect events
-added on fail event

0.2.0
-Update to 4.13
-Added connect/disconnect signatures (these have to be implemented by
the server if used)
-Added C++ lambda binds do e.g.
BindDataLambdaToEvent([&](const FString& EventName, const FString& EventData) { //your code }, Name, Namespace);
to use it
-Bind changed name to BindEvent
-Added Namespace support
-Connection runs on background thread (should not be blocking anymore)

0.1.2
-Updated compiled dlls and version for 4.12 (no code changes)

0.1.1
-First release

[getnamo]

Running into Errors everytime I start the Project, the Socket.io Actor Component is undefined, and thus breaks all blueprint notes and routes. And idk why. Anyone had this happen too them?

Please post to https://github.com/getnamo/socketio-client-ue4/issues with detailed steps to reproduce problem (make sure to mention platform, unreal engine version)

[getnamo]

Hey,

I got your Android supported release, for 4.22, and built for 4.20. It doesn't want to connect from my phone though.. I put the address and port as http://192.168.0.101:3000, it works when I play in the viewport but not when I build to my phone. It's connected to the same Internet etc. Is there anything extra that I need to do?

Please post to https://github.com/getnamo/socketio-client-ue4/issues with a detailed example of how you tried to make it work (steps to reproduce)

[getnamo]

Is it possible just to use this for JSON-RPC calls, or its not really in scope of this plugin?

If you mean using the socket.io protocol to do JSON-RPC calls, this is supported since both ends can understand and parse json.

You can use e.g. https://github.com/getnamo/socketio-...-with-callback and emit and receive calls, the server can use this passed in callback to remotely callback https://github.com/getnamo/socketio-...server-example. You'd only need to make sure you follow jsonrpc spec (https://www.jsonrpc.org/specification) in your communication.


If you meant doing basic JSON http requests, this is supported albeit not the main focus of the plugin. I've added an example for a JSON http post request https://github.com/getnamo/socketio-...-json-requests.

[getnamo]

Hi,

anybody can give me a hint how to get dynamic "rooms" for clients to join? (via room-ids)
Server-Side its something like this:

// attach Socket.io to our HTTP server
io = socketio.listen(server);

// handle incoming connections from clients
io.sockets.on('connection', function(socket) {
// once a client has connected, we expect to get a ping from them saying what room they want to join
socket.on('room', function(room) {
socket.join(room);
});
});

// now, it's easy to send a message to just the clients in a given room
room = "abc123";
io.sockets.in(room).emit('message', 'what is going on, party people?');

// this message will NOT go to the client defined above
io.sockets.in('foobar').emit('message', 'anyone in this room yet?');

but how to do the client-side via Blueprints?
Client-Side:

// set-up a connection between the client and the server
var socket = io.connect();
// let's assume that the client page, once rendered, knows what room it wants to join
var room = "abc123";
socket.on('connect', function() {
// Connected, let's sign-up for to receive messages for this room
socket.emit('room', room); });
socket.on('message', function(data) {
console.log('Incoming message:', data); });

Thanks in advance for help :-)

It looks like you just connect and emit to the 'room' event name with 'abc123' room string id.

The equivalent in blueprints is

but with the changed event names/message value.

Also in your begin play you'd bind to the event 'message'


Full documentation is available at

https://github.com/getnamo/socketio-...se---bp-basics

[getnamo]

I am running into big issues and I do not know how to solve it.

My UE 4.22 (UE 4.22-Oculus build from source) project, using the latest version of this plugin, running in Mac, disconnects the socket unexpectedly and is then no longer able to reconnect properly. I'm using manual connect and I'm *not* using a Plugin Scoped connection. Basically my projects send approx. 10 messages per 'tick'. With a slow tick internal, like one tick every second, it's stable and there are no problems. When I have the tick interbal on 0.1 second (so approx. 100 messages per second) it soon disconnects and cannot reconnect again. I see this in the log:

...
SocketIOLog: SocketIO eKjVnNjoMd2x6eRHAAAB appears to have lost connection, reconnecting attempt 0 with delay 5000
...

It then looks like it is rebuilding the connection. First to the default namespace and then to the namespace I was using. And the I get the same message 'lost connection' message again.

First of all I'm worried about the initial disconnect and the consecutive disconnects (after reconnect).

I'm using a node.js server with socket.io version 2.2.0.

Any ideas why this is happening?

What's the C++ Socket IO client version that is being used? There may be a version mismatch. I have seen some reports about socket.io that indicate that you should make sure version is on par with server version.

Any help is appreciated.

This is likely related to https://github.com/getnamo/socketio-...ue4/issues/126, I'm still looking into the root cause of this, it seems to only affect the latest (v1.0), but versions earlier than that don't support Mac.

What's interesting is that you're able to disconnect it by sending ~100 messages/sec which definitely shouldn't happen. I've added a new issue for this bug: https://github.com/getnamo/socketio-...ue4/issues/135 and I'll try to replicate it as well.

It may be a bit of time before I get to the bottom of these two. Thanks for the detailed issue descriptions!

[Randolph Aarseth]

Running into Errors everytime I start the Project, the Socket.io Actor Component is undefined, and thus breaks all blueprint notes and routes. And idk why. Anyone had this happen too them?

[Metaverum]

Hey,

I got your Android supported release, for 4.22, and built for 4.20. It doesn't want to connect from my phone though.. I put the address and port as http://192.168.0.101:3000, it works when I play in the viewport but not when I build to my phone. It's connected to the same Internet etc. Is there anything extra that I need to do?

[RyuMaster]

Is it possible just to use this for JSON-RPC calls, or its not really in scope of this plugin?

[Bartolomeus76]

Hi,

anybody can give me a hint how to get dynamic "rooms" for clients to join? (via room-ids)
Server-Side its something like this:

// attach Socket.io to our HTTP server
io = socketio.listen(server);

// handle incoming connections from clients
io.sockets.on('connection', function(socket) {
    // once a client has connected, we expect to get a ping from them saying what room they want to join
    socket.on('room', function(room) {
        socket.join(room);
    });
});

// now, it's easy to send a message to just the clients in a given room
room = "abc123";
io.sockets.in(room).emit('message', 'what is going on, party people?');

// this message will NOT go to the client defined above
io.sockets.in('foobar').emit('message', 'anyone in this room yet?');

but how to do the client-side via Blueprints?
Client-Side:

 // set-up a connection between the client and the server
var socket = io.connect();  
// let's assume that the client page, once rendered, knows what room it wants to join
var room = "abc123";  
socket.on('connect', function() {    
// Connected, let's sign-up for to receive messages for this room    
socket.emit('room', room); });  
socket.on('message', function(data) {    
console.log('Incoming message:', data); });

Thanks in advance for help :-)

[iambeeblebrox42]

I am running into big issues and I do not know how to solve it.

My UE 4.22 (UE 4.22-Oculus build from source) project, using the latest version of this plugin, running in Mac, disconnects the socket unexpectedly and is then no longer able to reconnect properly. I'm using manual connect and I'm *not* using a Plugin Scoped connection. Basically my projects send approx. 10 messages per 'tick'. With a slow tick internal, like one tick every second, it's stable and there are no problems. When I have the tick interbal on 0.1 second (so approx. 100 messages per second) it soon disconnects and cannot reconnect again. I see this in the log:

...
SocketIOLog: SocketIO eKjVnNjoMd2x6eRHAAAB appears to have lost connection, reconnecting attempt 0 with delay 5000
...

It then looks like it is rebuilding the connection. First to the default namespace and then to the namespace I was using. And the I get the same message 'lost connection' message again.

First of all I'm worried about the initial disconnect and the consecutive disconnects (after reconnect).

I'm using a node.js server with socket.io version 2.2.0.

Any ideas why this is happening?

What's the C++ Socket IO client version that is being used? There may be a version mismatch. I have seen some reports about socket.io that indicate that you should make sure version is on par with server version.

Any help is appreciated.

[getnamo]

Hey there,

I´m trying to store some profilepictures with a nodejs socket.io server into a mongodb database.
I tried a lot of stuff but unfortunately I can´t get it workin'.

I attached 3 screenshots.
One from inside of UE,
one of the saved "<Binary Data>" inside the mongo db database..
and the last one shows the "<Binary Data>" printed from the nodejs server after getting it from the datatable..
But when I get the binary data within unreal it´s emtpy.. Is this any known bug? - or am I doing anything wrong?

Thanks in advance for any help <3!

I just checked the latest version of the plugin against a binary roundtrip test and it still works as expected. I don't see your node.js logic in the pictures, without that I can only make assumptions. It looks like you're trying to get the field 'avatar' when your json has the binary data under 'useravatar' so it could be getting the wrong field which is why it would be empty... Otherwise the blueprints look correct at a glance. You might consider using emitWithCallback if you're trying to fetch some information from the server which would obviate the need to bind and emit another event for receiving the data.

[Mad_Toni]

Hey there,

I´m trying to store some profilepictures with a nodejs socket.io server into a mongodb database.
I tried a lot of stuff but unfortunately I can´t get it workin'.

I attached 3 screenshots.
One from inside of UE,
one of the saved "<Binary Data>" inside the mongo db database..
and the last one shows the "<Binary Data>" printed from the nodejs server after getting it from the datatable..
But when I get the binary data within unreal it´s emtpy.. Is this any known bug? - or am I doing anything wrong?

Thanks in advance for any help <3!

[getnamo]

First,it's awsome.But as a new learner,I got some questions.
if I want to use the server to connect to mysql ,how could I use variables in ue4 as parametres to execute sql query?
thanks a lot.

I'd probably form my query as a blueprint struct with desired parameters, then use the Struct to Json Object to convert it to a json object and emit that to your server. From there you can use the json object to form your sql query. See https://github.com/getnamo/socketio-client-ue4#structs for details on how to formulate complex json objects using structs.

[qiben321456]

First,it's awsome.But as a new learner,I got some questions.
if I want to use the server to connect to mysql ,how could I use variables in ue4 as parametres to execute sql query?
thanks a lot.