chesslablab / chess-server

Asynchronous PHP chess server.
https://chesslablab.github.io/chess-server/
MIT License
47 stars 24 forks source link

WebSocketization of the API endpoints #311

Closed programarivm closed 1 month ago

programarivm commented 1 month ago

The API endpoints in the chesslablab/chess-api repo are to be rewritten in the chesslablab/chess-server in the form of WebSocket commands. One of the main reasons behind this decision is the optimization of resources. The PHP Chess API has demonstrated to be not too efficient while hosted in an AWS t2.micro instance along with Chess Data.

docker ps -a
CONTAINER ID   IMAGE            COMMAND                  CREATED        STATUS          PORTS                                                  NAMES
abb9dfb42450   chess-api-php    "docker-php-entrypoi…"   11 hours ago   Up 51 seconds   9000/tcp                                               chess_api_php
b51c5fd6b63c   nginx:1.20       "/docker-entrypoint.…"   11 hours ago   Up 51 seconds   80/tcp, 0.0.0.0:9443->9443/tcp, :::9443->9443/tcp      chess_api_nginx
034c5c242a03   mysql:8.4        "docker-entrypoint.s…"   25 hours ago   Up 51 seconds   0.0.0.0:3306->3306/tcp, :::3306->3306/tcp, 33060/tcp   chess_data_mysql
0580c1de47ba   chess-data-php   "docker-php-entrypoi…"   25 hours ago   Up 51 seconds   9000/tcp                                               chess_data_php

This is too many Docker containers. So we're moving to a WebSocket architecture based on multiple connections as described at Multiple websocket connection vs single websocket connection when using django channels.

Suppose an application has features like Chat, Notification and Activity feeds.

Let's stick with separation of concerns.

The former will specialize in database commands and the latter in game commands.

See:

Happy learning!


joanhey commented 1 month ago

Please, could you show the output of docker stats, it's more informative about the server usage.

Another option is use SSE instead of Websockets. Websocket it's ideal for a multiplayer shooting game, the browser could be continuously streaming the player’s position, while simultaneously receiving updates on the location of all the other players from the server.

But with a chess game it is not necessary.

The Server Send Events (SSE) protocol is very simple and a better option. Almost it's a good start to discussion (talk) to understand it.

joanhey commented 1 month ago

In reality Websockets are more vulnerable and heavier on resources. WebSocket connections are not protected by the same-origin policy. This makes them vulnerable to Cross-Site WebSocket Hijacking.

Other drawbacks:

joanhey commented 1 month ago

Of course, SSE is a realtime push protocol, that stream the data continuously. I don't know witch server app you used for the SSE.

Perhaps, you used a PHP SSE with php-fpm, that it isn't event driven and for that need to send the data every x time. But Workerman is event driven, as soon as the SSE receive the event it's send to the browser.

programarivm commented 1 month ago

PHP Chess Server is an asynchronous PHP server that provides functionality to play chess online over a WebSocket connection allowing support for multiple async PHP frameworks, with the default one being Workerman.

See:

Let's do this by your powers combined!

@walkor @clue @bwoebi

joanhey commented 1 month ago

You can also support multiple SSE backends.

joanhey commented 1 month ago

Ratchet use ReactPHP, and ReactPHP have SSE https://github.com/clue/php-sse-react

Workerman SSE https://manual.workerman.net/doc/en/http/SSE.html

I did'n find the SSE protocol in AMPHP, but it's very simple to implement.

And apart from PHP, we can use any SSE server from any language transparently from PHP.

joanhey commented 1 month ago

I created the Workerman vmstats using SSE instead of Websockets, and the code in the backend and more in the frontend is simplified and with less lines.

Websockets

https://github.com/walkor/workerman-vmstat

SSE

https://github.com/joanhey/workerman-vmstat

joanhey commented 1 month ago

Suppose an application has features like Chat, Notification and Activity feeds.

SSE is the best option for that situations.

joanhey commented 1 month ago

I only give another option, that can simplify the code work. But the decision is of @programarivm .

joanhey commented 1 month ago

Also the SSE option is very good to other people watch the games realtime from other people.

joanhey commented 1 month ago

SSE was not used, because IE and Edge didn't support it till 2020, ten years later than the others browsers. Even when exist pollyfills for this easy protocol.

Another problem was that with http 1.1, the browsers limit to 6 connections to the same server. But now with http 2 and http3 is not a problem.

Websocket don't work with http2, use http1 and for any tab open need a new TCP connection to the server. Exist an RFC to use webscocket with http2, but I doubt that arrive to the browsers, because for http3 exist a new protocol WebTransport, that is better. https://caniuse.com/?search=webtransport

joanhey commented 1 month ago

You can inspect all the Websocket traffic, and I think that it is OK that is readable.

image

joanhey commented 1 month ago

They send the messages in binary format, that it isn't necessary for that app. Only extra work in server and client. image

EDIT: an the rare thing is that all the time send messages, even without moving any piece or do anything !!

joanhey commented 1 month ago

SSE only permit UTF8 text, for send binary they use base64-encoding.

PD: Send in binary format don't hide anything.

joanhey commented 1 month ago

Extra work without advantages. It's the server who need to authorize the premium features by user.

PD: obfuscation was never a good security system.

joanhey commented 1 month ago

Sorry I'm not here for Chessbase_com. And this issue is not also. If you ask for my services, you need to pay me first. Thank you.