Using websockets between webbrowser client and ReactPHP sockets server

[NotionCommotion]

How can I access a ReactPHP sockets server?  Not looking for client side assistance (I will need it be it is a question for another forum) but the server side.  Don't even know where to start. I know the IP and port where the socket server is running.  I saw a client side tutorial which showed creating the connection as websocket = new WebSocket("ws://echo.websocket.org/");. What happens in between?  Thanks 

[kicken]

What do you mean what happens in between?

 

For the browser take a look at the Websocket API if you want to learn about how to deal with them. The basic code would look something like this:

var socket = new WebSocket('ws://example.com:8000');
socket.onmessage = function(e){
	/* e is a MessageEvent object (https://developer.mozilla.org/en-US/docs/Web/API/MessageEvent) */
	console.log(e.data);
};

socket.send('Hello!');

If you want to connect from PHP over the websocket protocol to your server then you'd need to either find an implementation of the websocket protocol to use or create your own (which could be done using React's client sockets stuff).

 

Also make sure your React server speaks the Websocket Protocol. WebSocket is a specific protocol with a defined format, not just a way to connect to any open socket server.

[NotionCommotion]

What do you mean what happens in between?

Your post showing both a domain name and port might have clarified my confusion.   Would one just go to domain host, and have ws://example.com: point to the appropriate IP, and the connection port would be as specified on the client (8000 for your example) or 80 or 443 if not specified?  Would it use 80 if the the HTML page used 80 or if the JavaScript file used 80?

 

 

If you want to connect from PHP over the websocket protocol to your server then you'd need to either find an implementation of the websocket protocol to use or create your own (which could be done using React's client sockets stuff).

 

Is Ratchet a implementation of the websocket protocol?  Does it use ReactPHP?  I see it is on the http://reactphp.org/ website, but I couldn't find any reference to ReactPHP on http://socketo.me/.

 

My interest in websockets was to provide webbrowser logging screen displaying communication between a non-websocket client and a non-websocket server.  My thought was the non-websocket client would initiate communication to the server, and give the server something to identify itself.  A websocket client could then connect to the server and provide the identifier.  The server script could then send the data sent to and received from the non-websocket client to the websocket client.  I am not sure if it is possible, but it might be nice for the server to listen to two different ports so it knows whether it is communicating with the non-websocket client or the websocket client.

 

If a single server was used to interface to both clients, it would make transferring the information easy, but then requires building a websocket server myself with ReactPHP.

 

Don’t know whether this makes any sense!  But if it does, how difficult would it be to implement?  Also, would you recommend creating my own websocket server or using one which has already implemented the websockets protocol?

 

Thanks

[kicken]

Your post showing both a domain name and port might have clarified my confusion.   Would one just go to domain host, and have ws://example.com: point to the appropriate IP, and the connection port would be as specified on the client (8000 for your example) or 80 or 443 if not specified?  Would it use 80 if the the HTML page used 80 or if the JavaScript file used 80?

The parameter you give to the WebSocket construct is just a standard URL using either the ws:// or wss:// scheme. The websocket protocol is built on top of http / https so it defaults to those same ports. ws:// uses HTTP and would default to 80, wss:// uses HTTPS and would default to 443. If you're server runs on an entirely separate port then you'd just specify that in the URL like shown.

 

 

Is Ratchet a implementation of the websocket protocol?  Does it use ReactPHP?  I see it is on the http://reactphp.org/ website, but I couldn't find any reference to ReactPHP on http://socketo.me/.

Yes, ratchet is an implementation of the server-side of the WebSocket protocol. Yes, it does use React.

 

 

What you want to do is certainly possible. Your server can listen on however many ports it wants too, and having separate ports for the different client types is a good way to go.

 

Setting up a simple server that can accept connections from both of your clients probably would not be that hard. Developing the process for how exactly to share the data and move things between clients is probably going to be where you'll have to spend the most time.

 

Also, would you recommend creating my own websocket server or using one which has already implemented the websockets protocol?

Use as much already existing stuff as you can provided it does what you need (or can be easily modified to do so). It'll save you a lot of time and headache. Writing your own stuff generally isn't worth while unless your goal is specifically to learn about how to write said stuff. If you want to learn the depths of the websocket protocol and how it works then write your own server and client. If you just want to use it to get a job done, use pre-written stuff.

 

Writing my own Websocket server (if your curious) back when I first started messing with this stuff was a pain, and what I ended up with would be pretty poor code compared to the stuff that exists today.

[NotionCommotion]

The parameter you give to the WebSocket construct is just a standard URL using either the ws:// or wss:// scheme. The websocket protocol is built on top of http / https so it defaults to those same ports. ws:// uses HTTP and would default to 80, wss:// uses HTTPS and would default to 443. If you're server runs on an entirely separate port then you'd just specify that in the URL like shown.

 I didn't think I can have two services bound to the same port.  If on the same machine which runs an Apache/Nginx/etc HTTP server and the ReactPHP socket server, wouldn't they be be bound to the same port and conflict?

 

 

What you want to do is certainly possible. Your server can listen on however many ports it wants too, and having separate ports for the different client types is a good way to go.

Ah, perfect!  Just something like the following and use $_SERVER to determine the port?

$socket->listen(1337,'0.0.0.0');
$socket->listen(1234,'0.0.0.0');
$loop->run();

Setting up a simple server that can accept connections from both of your clients probably would not be that hard. Developing the process for how exactly to share the data and move things between clients is probably going to be where you'll have to spend the most time.

 

Use as much already existing stuff as you can provided it does what you need (or can be easily modified to do so). It'll save you a lot of time and headache. Writing your own stuff generally isn't worth while unless your goal is specifically to learn about how to write said stuff. If you want to learn the depths of the websocket protocol and how it works then write your own server and client. If you just want to use it to get a job done, use pre-written stuff.

 

Writing my own Websocket server (if your curious) back when I first started messing with this stuff was a pain, and what I ended up with would be pretty poor code compared to the stuff that exists today.

While a goal is always to learn, will definitely go with some pre-written stuff (ReactPHP) for now  (looking at your own Websocket server script, I can tell you definitely spent some time!).

 

The thought of me implementing the websocket’s protocol on top of a ReactPHP server is a little daunting, however, probably a good learning experience.

 

If a single server, I think dealing with routing data to the appropriate client shouldn’t be that difficult.  If I have both a plain socket server and a Ratchet/etc websocket server, would the two servers be different requiring me to do something such as implement a socket client in the websocket server which sends the data to the sockets server, or can I just call some method such as $this->socket->sendSomethingUsingRatchet($someData); which would directly allow it to be sent to the websocket client?