WebSocket и SSE: чат поддержки «Линия»
Проект «Линия» развивает один разговор поддержки: вымышленные Алиса и Борис имеют свои обращения, оператор участвует в обоих. Начинаем с договора сообщений и HTTP, затем добавляем канал WebSocket, проверку команд, комнаты и серверные права. Последующие шаги связывают подтверждения с журналом, порядком и повтором, вводят восстановление после разрыва, присутствие, SSE, ограничения буфера и доступный интерфейс.
Нужны основы JavaScript, модулей, функций, объектов, HTTP и событий браузера. Среда примера: Node.js 24 LTS, Express 5.2.1, ws 8.18.3 и современный браузер. Версии пакетов подтверждены по официальным тегам. Это самостоятельные уроки по первичной документации, без приписывания содержания новому видеоплейлисту.
Учебный выбор персонажа не проверяет личность. Сервер создаёт случайную cookie HttpOnly, проверяет Origin и привязывается к 127.0.0.1:4310. URL не содержит реальных имён или секретов. Для двух участников используйте разные профили браузера: вкладки одного профиля делят cookie. Не вводите настоящие обращения.
Журнал хранится в памяти одного процесса: последние 200 сообщений комнаты, 2000 результатов команд и 100 SSE-уведомлений. После рестарта теряются сессии и данные. Восстановление продолжает видимую историю только в сохранённом окне; новая эпоха требует сброса. Отзыв прав, долговечная запись и масштабирование нескольких процессов остаются задачами production-проекта.
Все примеры имеют статус not_run. Зависимости не устанавливались, приложения, Redis и тесты не запускались; сборка учебного приложения и деплой не выполнялись. Ответы, состояния интерфейса и количества в уроках являются ожидаемыми, а не полученными. Lockfile не создавался без установки пакетов.
Последовательность уроков
| Урок | Новый результат |
|---|---|
| 1. Договор сообщений и учебная идентичность | Описать события, команды и границу учебного входа. |
| 2. HTTP-каркас чата поддержки | Раздать страницу и создать локальную сессию через HTTP. |
| 3. Переключение HTTP на WebSocket | Проверить Origin и сессию до handleUpgrade. |
| 4. Состояния браузерного WebSocket | Связать форму с открытием и закрытием соединения. |
| 5. Проверка входящих сообщений | Отделить допустимую команду от произвольного JSON. |
| 6. Комнаты обращений | Направить сообщение только участникам выбранной комнаты. |
| 7. Права участника обращения | Проверять доступ к комнате на каждой команде. |
| 8. Идентификатор команды и подтверждение | Связать отправку с серверным подтверждением принятия. |
| 9. Журнал сообщений и история комнаты | Сохранить ограниченный журнал и вернуть его при входе. |
| 10. Порядок сообщений и повторная команда | Использовать номер комнаты и окно подавления дублей. |
| 11. Переподключение и восстановление истории | Продолжить журнал по эпохе и курсору после разрыва. |
| 12. Присутствие и проверка живого соединения | Разделить присутствие пользователя и исправность сокета. |
| 13. Уведомления через Server-Sent Events | Передать одностороннее уведомление отдельным HTTP-потоком. |
| 14. Медленный клиент и пределы буфера | Ограничить накопление данных и частоту команд. |
| 15. Доступный интерфейс переписки | Сделать состояния, журнал и управление понятными с клавиатуры. |
| 16. Остановка чата и границы сопровождения | Закрыть потоки и сформулировать контракт учебного сервера. |
Скачать полные снимки проекта. Распакуйте архив в новую отдельную папку realtime-support-lab/, затем выберите один каталог stages/NN. Каждый номер самодостаточен: не объединяйте файлы разных состояний. Внутри есть README с предпосылками, инструкциями читателю и конкретными ограничениями. Архив не содержит зависимостей, сборок, .git, секретов и реальных данных.