WebGL WebSocket Troubleshooting

I am making a multiplayer WebGL application. Currently, clients can play together over local network, but I have been unable to get connections to work over other networks. The WebGL socket in MLAPI 0.1 are (confirmed) to not be working, so I have been using a custom WebSocket community transport. This is a thread I’m making to discuss my process, logs, and build. I’m hoping someone can eventually point me in the right direction to fix this.

Release: MLAPI 0.1 package
Unity Version: 2021.1.22f1

I downloaded the community WebSocket transport from https://github.com/Unity-Technologies/multiplayer-community-contributions/tree/main/Transports/com.mlapi.contrib.transport.websocket

To fix WebGL compilation errors, I was told to apply:
Manually Applied: fix: WebGL compilation by TwoTenPvP · Pull Request #724 · Unity-Technologies/com.unity.netcode.gameobjects · GitHub

To fix WebGL browser errors:
Disable compression: Player Settings → Publishing Settings → Compression Format → Disabled

Setup Steps:

  • For WebSocket Transport component, I had to set SecureConnection=False. HTTPS wasn’t working for me, I’m not sure why.
  • I uploaded my WebGL build to a custom Github Pages site. Under site settings for the page, I needed to ‘Allow’ insecure content… since GitHub is HTTPS and the game was over HTTP.
  • Since a WebGL instance can’t be a server, I needed to compile a Windows version of my application.
  • I launch a Windows instance of the application as ‘Host’ and enter in my IP for connect address and 7777 as port.
  • From a different computer, but on the same network, I run the WebGL instance of the application on my GitHub page and select ‘Client’ and enter my IP and port 7777. I can connect in this case and both players can see each other.
  • I restart the Windows instance. However, on the Client’s computer, I switch the network to my Phone’s hotspot. Then, I launch the ‘Client’ instance on the WebGL page. This time, the client instance cannot connect and neither player’s can see each other. It looks like the error is just that I can’t connect to the Websocket from the client’s instance.

I attached a picture of the failure logs from the client’s browser. I also uploaded the client’s browser logs when he is connected to the same network, versus a different network.

Please let me know if there is a certain section of information that I can provide to help debug the issue. If anyone can point me in the right direction to help solve this, that would be much appreciated!

7586230--940501--fail_connection.png
7586230–940504–different_network_connect.txt (4.47 KB)
7586230–940507–same_network_connect.txt (4.58 KB)

More information on the issue. The WebSocket opening handshake timed out. This happens on all browsers I test, FireFox and Google Chrome

The JSWebSocketClient.Connect() function is being called… but it’s external. So this is what I’m looking into.

1 Like

I can confirm that this is buggy in Websocket community transport for WebGL/Webassembly builds, it works with native client in Unity editor playmode if you hack in a sslprotocol configuration setup into the websocket-sharp websocket (its set to none by standard, which is ultimative bs btw…)

Hi, do you know already from what source code the JSWebSocketClient has been made from?
I want to join you to solve this issue which gives me sleepless nights since weeks
edit: alright its a java lib so the source to start looking is there in JSWebSocketClient.jslib
I also started to look into this , please let me know if you find something useful , i will do too

I found out that the port specified for websockets matters. You should use port 80 for unsecure websocket connections (ws → http) and port 443 for secure websocket connections (wss → https). I’m able to get LAN multiplayer working with a WebGL build running from these ports on a website.

I haven’t continued onward, but in order to have other computers connect to you, your WIFI has to have the right port forwarding setup and also a dedicated server from my understanding.

Hmmm, and when you before tried a custom port it didnt work?
However I find it a bit bad and strange, that we need to use the standard https port, thats a workaround but not a solution I think. however VERY MUCH thanks for your resonse I’ll check that if I dont find a way in a week or so.
Note: I also tried much and so far its crazy when trying with wscat tool , look the screen snippet, if you fast enough you can type and send 2 “pings” and even receive 2 pongs from the server until the connection is just dropped with code 1000 (normal close) for which no reason exists

7704895--965269--pingpong.PNG