WebSocket: что это такое и как работает

WebSocket – это протокол, позволяющий установить постоянное соединение между клиентом и сервером для обмена данными в реальном времени.

В отличие от HTTP, где каждый запрос является отдельным, WebSocket работает через одно длительное соединение.

Пример: WebSocket на фронтенде (JavaScript)

const socket = new WebSocket('ws://localhost:3000');

socket.onopen = () => {
    console.log('Підключено');
    socket.send('Hello');
};

socket.onmessage = (event) => {
    console.log('Повідомлення:', event.data);
};

Пример: WebSocket сервер на Node.js

npm install ws

const WebSocket = require('ws');
const server = new WebSocket.Server({ port: 3000 });

Пример: WebSocket в Laravel (PHP)

Laravel не работает с WebSocket из коробки, но имеет удобную систему Broadcasting.

Самые популярные варианты:

• Laravel WebSockets (self-hosted)

• Pusher (SaaS)

Рассмотрим self-hosted вариант.

Шаг 1: Установка пакета

composer require beyondcode/laravel-websockets

Шаг 2: Публикация конфигурации

php artisan vendor:publish --provider="BeyondCode\LaravelWebSockets\WebSocketsServiceProvider"

Шаг 3: Запуск сервера

php artisan websockets:serve

Шаг 4: Создание события (Event)

php artisan make:event MessageSent

use Illuminate\Broadcasting\Channel;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
class MessageSent implements ShouldBroadcast
{
public $message;
public function __construct($message)
{
    $this->message = $message;
}

public function broadcastOn()
{
    return new Channel('chat');
}

Шаг 5: Отправка события

event(new MessageSent('Привіт з Laravel'));

Шаг 6: Подключение на фронтенде (Laravel Echo)

npm install laravel-echo pusher-js

import Echo from "laravel-echo";
import Pusher from "pusher-js";
window.Pusher = Pusher;
window.Echo = new Echo({
broadcaster: 'pusher',
key: 'local',
wsHost: window.location.hostname,
wsPort: 6001,
forceTLS: false,
disableStats: true,
});

Когда использовать Laravel + WebSocket

Этот стек идеально подходит для:

• чатов в CRM

• live-нотификаций

• админ-панелей

• real-time обновление статусов заказов

Важные нюансы

• Laravel использует Broadcasting, а не "чистый" WebSocket

• нужен отдельный WebSocket сервер

• для продакшена часто добавляют Redis

WebSocket vs HTTP

Вывод

WebSocket открывает возможности для создания действительно интерактивных веб-приложений. В связке с Laravel он позволяет быстро реализовать real-time функционал без сложной низкоуровневой логики.

Главное – использовать его там, где это действительно оправдано.