Networking with HTML5

Monkey Targets Forums/HTML5/Networking with HTML5

Raph(Posted 2015) [#1]
I've been away from Monkey for a while -- has a networking solution for HTML5 been developed by anyone? Interested in sockets in particular.


ImmutableOctet(SKNG)(Posted 2015) [#2]
This is going to be a lot to take in, so have at it:

Kind of... The issue with networking on HTML5 is that a lot of it isn't really portable, or well represented at a lower level. This means 'brl.socket' is a bit too specific for comfort. What you want are "WebSockets". WebSockets are a means of having the browser open a highly controlled TCP stream between your browser and a server. It does this by first opening a TCP connection, then performing a "handshake" using what is effectively pseudo-HTTP. Don't get me started on how terrible that process is, especially when you're doing it all from scratch (Like I did). With that out of the way, the main format is pretty simple, but annoying to parse. It splits messages up into parts, has a questionable header, and XORs the message (Not too sure on this one. Security, maybe?). You should also take note that WebSockets are a new and experimental technology in browsers. Though, at this point the basic specs have been implemented almost everywhere you'd be targeting. But enough about the details, the point is that 'brl.socket' is a very big stretch. If you're on the other targets, it's a solid choice, but for HTML5? Not so much.

With this in mind, you'd need something better abstracted; something that can deal with WebSockets behind the scenes. I've developed a networking module that handles abstraction very well, and is standard I/O compliant ('brl.stream'). It's called 'regal.networking', and it's pretty nice now. There's some examples if you're interested. The main features are support for both TCP and UDP, connections, clients, pings, disconnections, multi-part packets, and protocol abstraction. It needs a bit of optimization here and there, but the feature-set is solid. Documentation is available here; see below for installation details, if you're interested.

So, what's the problem here, why doesn't it work with HTML5? The short answer is it can, and likely will, but it's not a priority at the moment. I started implementing a backend that does just that, but HTML5 support is pretty far from working. I started back in late October, but moved to other projects since WebSockets weren't a priority. I have some basic stuff going; initial message processing (Both ways), WebSockets are usable for HTML5 targets, etc. It's pretty far from done, though. On the bright side, I do intend to get back to working on it when I get the chance, so it might be a valid option later down the road.

So, what are your choices? Well, if you're not looking to wait, or you want to take a crack at it yourself, Monkey has a 'WebSocket module, called 'dom.websocket', available with your Monkey installation. This covers a basic, but functional wrapper for the JavaScript API (Not much is needed thanks to 'dom'). Though, like the rest of 'dom', it's not documented. To be fair, it's mostly the same as the standard DOM/WebSocket APIs anyway. There's a few minor changes, but it's simple enough to grasp by looking the bindings over. And of course, native JavaScript is always an option.

There's also Ferdi's somewhat older "PushButton" module, which should support WebSockets, but I'm not too familiar with it. It's also TCP only, but that's always the case with HTML5. I also have no idea about documentation.

It's from an era where UDP was only a thing from third parties; ANet by Sub_Zero, and of course, QuickSock, a long outdated wrapper of my C++ library. Don't use these as anything but potential references. If you're looking at QuickSock/QuickLib, please view the newest source on GitHub.

For normal sockets (Other targets), you've got 'brl.socket', as previously mentioned. You've also got 'brl.httprequest', available for just about everything. There's also 'brl.tcpstream', but that requires 'brl.socket'.

Then there's my old, unholy abomination of a codebase, 'regalnet', which no one should use now. (Succeeded by 'regal.networking', as brought up before)

So, that's the main list. The main thing about HTML5 to take away here is that it's convoluted. As a side note, if it wasn't obvious already, you can't host a server using normal WebSockets. For that, you'd need a server to mediate the packets.

If you're interested in what my module can do, it can be found here. As I said, though, it doesn't support HTML5 yet. Documentation for it can be found here. That module depends on my other modules, so if you're planning on installing it, you should follow the installation guide. The docs aren't perfect, but they're pretty comprehensive.

Documentation for the official modules can be found here (Official; somewhat outdated). An unofficial mirror, with up-to-date docs can be found here on GitHub, including my own modules' docs (Currently 'regal.networking' and defaults)


ImmutableOctet(SKNG)(Posted 2015) [#3]
-


Raph(Posted 2015) [#4]
Thanks for the detailed answer -- I knew some of this, but not all! I had in fact downloaded regal.networking already, for example.

Sounds like you can make an HTML5 client to a networked game, but with effort; and can't really use Monkey to make a server app unless you are running a Windows server.

I was hoping to do some quick prototypes of server-based games using a single codebase and language.


ImmutableOctet(SKNG)(Posted 2015) [#5]
Yeah, for that you'll still need to use a dedicated server (Windows, Mac, Linux, or BSD potentially). The client could still be done in JavaScript, but you're stuck with "PushButton" or 'regal.networking' (Eventually).

The only other option right now is Client -> Server -> Client packet routing. To be fair, that's what most multiplayer games do, anyway, just with a proper dedicated program. Peer-to-Peer isn't really going to happen authentically, which kind of sucks.


Raph(Posted 2015) [#6]
I wonder how feasible it would be to wrap libwebsockets as a module for the HTML5 target, and then use that for servers, with game logic in Monkey...


k.o.g.(Posted 2015) [#7]
I'm currently working on a Network modul for me.

All targets that has brl.socket implemented can hosts servers and all other targets with brl.socket + HTML5 can be a client.

But very early and still in progress.




Raph(Posted 2015) [#8]
Oh nice! Still calls for Windows Server hosting if you were to deploy anything on the web, but still pretty cool.

Did you basically just implement a Websocket server with brl.socket?


k.o.g.(Posted 2015) [#9]
Yes, have implemented the WebSocket handshake and on Client Side, all Clients connects over the WebSocket protocol, so you can use an GLFW Client to connect to an Java Websocket Server etc.


Dip(Posted 2015) [#10]
Thanks for that comprehensive post, ImmutableOctet(SKNG)! I've been getting back into Monkey recently and struggling to find good implementation/docs for cross-platform networking. I'm checking your stuff out now. Thanks!