3.8. WebSockets

В этой статье мы расскажем, что такое WebSockets и как его использовать для передачи данных. Начнём с процесса передачи данных без WebSockets: посмотрим, какие сложности при этом происходят и как протокол WebSocket их решает.

Клиент делает запрос на сервер для передачи каждого ресурса. Затем сервер отвечает на запрос, отправляя ресурс. Иными словами, HTTP работает по базовой архитектуре «запрос-ответ». При этом каждый раз происходит трёхстороннее «рукопожатие», что приводит к значительной задержке.

С протоколом WebSocket гораздо проще. Всё, что нужно сделать клиенту, — установить соединение с сервером, передав «рукопожатие» для протокола WebSocket. Это «рукопожатие» предоставляет всю необходимую идентифицирующую информацию для передачи данных. Канал после него остаётся открытым, чтобы обеспечить почти постоянную связь. Это означает, что сервер может доставлять данные самостоятельно, без запроса от клиента. Также, если сервер получает новые данные, он доставляет их клиенту без специального запроса.

WebSockets поддерживает постоянное соединение между клиентом и сервером. Во время этого соединения клиент и сервер могут отправлять ресурсы без запроса и в любое время.

Как работает WebSockets

Рассмотрим подробнее, как создаётся WebSocket-соединение. Сначала клиент, то есть браузер, отправляет на сервер HTTP-запрос, как при обычном HTTP-соединении. В заголовке указана информация о том, что клиент хочет установить WebSocket-соединение.

Клиент спрашивает сервер о поддержке WebSocket

Если сервер готов работать через протокол WebSocket, он ответит согласием:

Сервер отвечает о поддержке WebSocket

И включит в заголовок ответ с кодом 101 и информацией о переключении на протокол WebSocket:

Заголовок сервер о переходе на WebSocket

Этот процесс называется WebSocket-«рукопожатием». На этом моменте WebSocket-«рукопожатие» завершено. Теперь и клиент, и сервер могут отправлять данные через WebSocket-соединение. Закрыть WebSocket соединение могут и клиент, и сервер.

URL-адрес WebSocket использует схему ws://для обмена открытым текстом:

URL для обмена открытым текстом

WebSocket поверх TLS использует схему wss://:

URL для работы поверх TLS

WebSocket-соединение поверх TLS аналогичен HTTPS, когда HTTP работает поверх TLS.

Поддержка браузерами WebSockets

WebSockets поддерживаются во всех современных браузерах:

Поддержка браузерами WebSockets

Мониторинг трафика WebSocket с помощью Chrome Dev Tools

Инструменты разработчика Google Chrome включают функцию мониторинга трафика через WebSocket. Чтобы получить доступ к этому инструменту, нужно выполнить следующие действия:

  • откройте инструменты разработчика;
  • переключитесь на вкладку Network;
  • нажмите на запись подключения WebSocket;
  • переключитесь на вкладку Frames.

Эти инструменты покажут сводку всех данных, отправленных через соединение.

WebSockets на сервере

Мы сосредоточились на использовании WebSockets с точки зрения клиентской стороны. Для создания собственного сервера WebSocket существует множество библиотек. Одна из самых популярных — socket.io.

Итог

Технология WebSocket предназначена для того, чтобы сделать интернет быстрее и динамичнее. Это протокол, необходимый для современных веб-приложений, требующих более быстрого взаимодействия, чем может обеспечить стандартное HTTP-соединение. Однако не следует отказываться от HTTP: он по-прежнему остаётся важным интернет-протоколом.

Перейдём к практике и научимся использовать WebSockets.