Problems with Websockets and HTML5 export

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By ZedPoirier

Hey there I’ve trying to sort this out for a while now and hoping someone can help.

The Goal: To have multiple HTML5 players (hosted on itch.io) connecting to a single windows app as the server/host player. This will be an assymetrical game, and this is totally an experimental thing, so im trying to avoid using an external server for now…

What I Have So Far: I have the websocket server running on win10 and an HTML5 client running on itch.io. They successfully connect when I access itch from the same local machine that is running the server and I use ws://127.0.0.1:4088 (localhost) as the url.
Using the HTML build on Itch.io, it will not connect from any other device on the same LAN, nor will it connect from the internet (had a friend try with my public IP).

Also: I have opened the port (4088, arbitrarily chosen) on my modem AND firewall. I have tested a windows and linux build of the client app and both are succesfully able to connect over LAN and via the internet (friend tested).

Final Thoughts: All this leads me to believe the problem lies with the HTML export… maybe I missed something specific to HTML5? Does my setup just not work in HTML5 exports? I’m new to networking so hopefully I’m just missing something obvious!

Attached my code, hope you can help :slight_smile:

Client.gd

extends Node

# manually enter url in a textedit node
# triggers connection with a button press
var url
var network
var port = 4088
var max_players = 1000

func _ready():
	network = WebSocketClient.new()
	network.connect("connection_failed", self, "OnConnectionFailed")
	network.connect("connection_succeeded", self, "OnConnectionSucceeded")
	network.connect("connection_error", self, "OnConnectionError")


func _process(delta):
	if (network.get_connection_status() == NetworkedMultiplayerPeer.CONNECTION_CONNECTED || network.get_connection_status() == NetworkedMultiplayerPeer.CONNECTION_CONNECTING):
		network.poll()


func _on_Button_pressed():
	print("Client Initialising...")
	url = $UI/TextEdit.text
	ConnectToServer()


func ConnectToServer():
	var error = network.connect_to_url(url, PoolStringArray(), true)
	get_tree().set_network_peer(network)
	print("Client Initialised")


func OnConnectionFailed(playerID):
	print("Failed to connect")
	$UI/Label.text = "Failed to connect"


func OnConnectionError():
	$UI/Label.text = "Connection Error"


func OnConnectionSucceeded(playerID):
	print("Succesfully connected")
	$UI/Label.text = "Successfully connected"

Server.gd

extends Node

var network = WebSocketServer.new()
var port = 4088
var max_players = 1000

func _ready():
	print("Server Initialising...")
	StartServer()


func _process(delta):
	if network.is_listening():
		network.poll()


func StartServer():
	network.set_bind_ip("*")
	network.listen(port, PoolStringArray(), true)
	get_tree().set_network_peer(network)
	network.connect("peer_connected", self, "PeerConnected")
	network.connect("peer_disconnected", self, "PeerDisconnected")
	print("Server Initialised")


func PeerConnected(playerID):
	print("User " + str(playerID) + " Connected")


func PeerDisconnected(playerID):
	print("User " + str(playerID) + " Disconnected")
:bust_in_silhouette: Reply From: Olaf007

Hi, if the website you use as environment for the Godot-export-HTML (in your case itch.io) uses https you cannot use your IP address with “ws://…”. However, the browser makes an exception for localhost - that’s why it worked this way.
You need to connect to your server with “wss://<your.domain.name>:”
This, consequentially, requires SSL encryption. You can generate self-signed keys and certificates within Godot using the Crypto-Reference. Yet, it would be better to use an official SSL certificate website instead. The link also shows how to use key and certificate on the server after creation.
HOWEVER, all this being said, I figured there is a Godot intern bug that disconnects the client from the server immediately when trying to connect to the server. There is no sign of an error, but the engine emits the “disconnect”-signal.
The easiest solution was to start an Apache server which runs the Godot-export-HTML unencrypted via “ws://…” - thus, this way, you wouldn’t have your project running on itch.io.

You can find a better explanation of the solution here.

Very useful, thank you!

I found this video which explained everything very well for anyone else working on something similar:
https://www.youtube.com/watch?v=gcopx40pwvY

jgee_23_ | 2022-08-27 23:10