WebSockets with Ratchet and Symfony

Richard Melo

@allucardster

About me

  • System Engineer
  • 8+ years experience
  • Fullstack Developer
  • SUDO co-founder

Agenda

  • Intro to WebSockets
  • Ratchet PHP
  • Ratchet and Symfony
  • Demo

What is a WebSocket?

"It's a computer communication protocol that enables interaction between a browser and a web server"

In a nutshell

  • Supported major Web browsers
  • Low latency
  • Bidirectional communication 
  • Uses a single TCP connection

Client

Server

Handshake

Connection opened

Bi-directional messages

Open and persistent connection

One side closes the connection

Connection closed

Time

WebSockets Pros:

  • Cross origin communication
  • Cross platform compatibility (desktop, mobile)
  • Any message structure is supported

WebSockets Cons:

  • Firewalls and proxies
  • Security
  • Monitoring
  • Scaling and load balancing

Ratchet PHP

"Ratchet is a PHP library to create real time, bi-directional applications between clients and servers over WebSockets."

In a nutshell

  • Architecture based in components
  • Allow implement WebSocket server
  • Allow implement WebSocket handler
<?php

namespace MyApp;

use Ratchet\MessageComponentInterface;
use Ratchet\ConnectionInterface;

class Chat implements MessageComponentInterface {
    public function onOpen(ConnectionInterface $conn)
    {
        //...
    }

    public function onMessage(ConnectionInterface $from, $msg)
    {
        //...
    }

    public function onClose(ConnectionInterface $conn)
    {
        //...
    }

    public function onError(ConnectionInterface $conn, \Exception $e)
    {
        //...
    }
}

WebSocket handler

<?php

use Ratchet\Server\IoServer;
use Ratchet\Http\HttpServer;
use Ratchet\WebSocket\WsServer;
use MyApp\Chat;

require dirname(__DIR__) . '/vendor/autoload.php';

$server = IoServer::factory(
    new HttpServer(
        new WsServer(        
            new Chat() // WebSocket handler instance
        )
    ),
    8080
);

$server->run();

Server

:~$ php bin/chat-server.php

How to run it?

var conn = new WebSocket('ws://localhost:8080');
conn.onopen = function(e) {
    console.log("Connection established!");
};

conn.onmessage = function(e) {
    console.log(e.data);
};

JS Client

conn.send('Hello World!');

How to send a message?

Ratchet and Symfony 

  • Implement WebSocket server
  • Handle multiple topics
  • Integrate web app security
  • Allow write in WebSocket programmatically

(Challenges)

Gos WebSocket Bundle

"Gos Web Socket is a bundle designed to integrate the WebSocket functionality on a Symfony application"

In a nutshell

  • PHP WebSocket server
  • PHP WebSocket client
  • JS WebSocket client
  • Integrates routing
  • Integrates security through websocket

Demo

https://github.com/allucardster/ws-xample

Thank you!

  • https://en.wikipedia.org/wiki/WebSocket
  • http://socketo.me/
  • https://github.com/GeniusesOfSymfony/WebSocketBundle
  • https://www.pubnub.com/blog/2013-09-11-what-are-websockets/
  • https://medium.com/@smartgamma/real-time-web-applications-with-php-and-ratchet-7b039fda2dbd
  • https://blog.samuelattard.com/the-tutorial-for-php-websockets-that-i-wish-had-existed/

References

Made with Slides.com