WebSocket Protocol

Also Known As

TL;DR

Explanation

WebSockets begin as an HTTP request with Upgrade: websocket header. After the server acknowledges, the connection upgrades to a persistent bidirectional TCP channel. Frames carry data in either direction — text or binary. Unlike HTTP request-response, the server can push data to the client at any time. The ws:// scheme is unencrypted; wss:// uses TLS. PHP WebSocket servers require a persistent process (Ratchet, Swoole, ReactPHP) since PHP-FPM terminates after each request.

Diagram

sequenceDiagram
    participant C as Browser
    participant S as Server
    C->>S: HTTP GET /chat<br/>Upgrade: websocket
    S-->>C: 101 Switching Protocols
    Note over C,S: TCP connection kept open
    C->>S: Frame: hello server
    S-->>C: Frame: hello client
    S-->>C: Frame: push notification
    C->>S: Frame: ping
    S-->>C: Frame: pong
    C->>S: Frame: close
    S-->>C: Frame: close
    Note over C,S: Full duplex - both sides push any time

Common Misconception

Why It Matters

Common Mistakes

• Using WebSockets for request-response patterns — HTTP is more appropriate; WebSockets suit continuous bidirectional streams.
• No heartbeat/ping — idle WebSocket connections are silently dropped by load balancers; send periodic pings.
• No authentication on the WebSocket connection — validate a token during the upgrade handshake before accepting the connection.
• Not handling reconnection — connections drop; clients must implement exponential backoff reconnection logic.

Code Examples

// No authentication on WebSocket upgrade:
$server->on('open', function(ConnectionInterface $conn) {
    $this->clients->attach($conn);
    // Anyone who connects receives all messages — no auth check
});

// Authenticate during upgrade:
$server->on('open', function(ConnectionInterface $conn) {
    $request = $conn->httpRequest;
    $token = $request->getQueryParams()['token'] ?? '';
    if (!$this->auth->validateToken($token)) {
        $conn->close();
        return;
    }
    $userId = $this->auth->getUserId($token);
    $this->clients[$userId] = $conn;
});

References

• ↗ https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API

Tags

Related Terms