[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

[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.

[getnamo]

getnamo - thanks a million for this plugin. Diving into it now. I'm really interested in using it to communicate with an IRC server to send and retrieve messages. I'm having trouble figuring how how to begin this using your plug-in. I have a web interface setup (KiwiIRC) connected to a IRC network, but I'm having trouble figuring out how to send login info (nickname) to the web interface from your plugin. Could you share any insight? Thanks so much.

This plugin connects unreal as a client of a socket.io server, so the best way to setup what you're looking for is to have a socket.io server in say node.js or python which does API calls to your other service (IRC) and forwards them to the unreal clients. (the plugin does support general http requests, but it's not recommended for real-time push services as you'd lose the bidirectionality and ease of use)

E.g. if you used a node.js server, you could probably use this npm package https://www.npmjs.com/package/irc, and then pipe the sent/received messages to your client via your desired events

just browsing the package, forwarding a message would be something like

client.addListener('message', function (from, to, message) {
    socket.emit('chat message', from + ' => ' + to + ': ' + message);
});

(see https://github.com/getnamo/socketio-...erver/index.js for a node.js server hosting a basic chat client, socket.on are events that the server receives, socket.emit (or io.emit for multicast) are server send functions)

https://github.com/getnamo/socketio-client-ue4-example is a good starting point to understand typical server and client side setup with full sources.

[jessekirbs]

getnamo - thanks a million for this plugin. Diving into it now. I'm really interested in using it to communicate with an IRC server to send and retrieve messages. I'm having trouble figuring how how to begin this using your plug-in. I have a web interface setup (KiwiIRC) connected to a IRC network, but I'm having trouble figuring out how to send login info (nickname) to the web interface from your plugin. Could you share any insight? Thanks so much.

[getnamo]

Sorry for delay. Already found troubles, it's my missed. I have question: why after connection stoped and server start again unreal can't connect to server.

You'll have to be more specifc with the details of what you're doing, describe it step by step. The plugin does automatically reconnect to servers if you stop them and restart them. There may be ~5-25 second delay before the connection is re-established depending on how long you've been disconnected though (you can change reconnection settings directly on the socketio client component).

[Kelt]

Did you bind your event so that it can be seen by 'On Event'? see https://github.com/getnamo/socketio-...se---bp-basics

Sorry for delay. Already found troubles, it's my missed. I have question: why after connection stoped and server start again unreal can't connect to server.

[getnamo]

I already try to emit connect to room, but i try send data into room from web-page to unreal with "On Event" and it's not work.

Did you bind your event so that it can be seen by 'On Event'? see https://github.com/getnamo/socketio-...se---bp-basics

[Kelt]

I already try to emit connect to room, but i try send data into room from web-page to unreal with "On Event" and it's not work.

[Kelt]

From a quick scan of the feature, it appears to be server based.

Follow e.g. http://psitsmike.com/2011/10/node-js...chat-tutorial/ and https://stackoverflow.com/questions/...s-in-socket-io to implement it on the server. On the client you'd only need an emit call to switch to the new room and the server handles the switch, in the stack overflow answer the server then emits a message back to the client to do any room update logic (in that example 'updaterooms').

Good day, it's mean on server side i wrote emit logic for connect new room and than "On Event" i can get message from server?

[getnamo]

Good day, how i can connect to dynamicly created room, can you explain?

From a quick scan of the feature, it appears to be server based.

Follow e.g. http://psitsmike.com/2011/10/node-js...chat-tutorial/ and https://stackoverflow.com/questions/...s-in-socket-io to implement it on the server. On the client you'd only need an emit call to switch to the new room and the server handles the switch, in the stack overflow answer the server then emits a message back to the client to do any room update logic (in that example 'updaterooms').

[Kelt]

Good day, how i can connect to dynamicly created room, can you explain?