Понять важные атрибуты WebSockets, которые должен знать каждый разработчик.

На заре Интернета веб-приложения были построены на основе HTTP-запросов, запускаемых взаимодействием пользователей. С развитием технологий возникла потребность в передаче данных в реальном времени и двусторонней связи. Это было требованием для приложений с малой задержкой, таких как,

  • Многопользовательские онлайн-игры
  • Чат-приложения
  • Обновление социальных лент в реальном времени
  • Табло спортивных результатов в реальном времени, спортивные тикеры и т. Д.

Решением были WebSockets. С его широким распространением появилось множество библиотек, упрощающих его приложения. Следовательно, многие из нас начали использовать эту технологию, не зная внутреннего устройства, что привело к неэффективности.

Поэтому в этой статье делается попытка охватить основные атрибуты WebSockets, чтобы уменьшить эти пробелы.

Архитектура WebSockets

По своей сути WebSockets определяет API, который устанавливает соединение сокета между клиентом и сервером. Это позволяет веб-браузеру и серверу отправлять данные в любом направлении. Кроме того, он также имеет несколько оптимизаций по сравнению с HTTP, что делает его лучше для связи в реальном времени.

Связь в реальном времени

С помощью HTTP-запросов браузер отправляет файлы cookie и другие заголовки, используя несколько сотен байтов, увеличивая накладные расходы на связь в реальном времени.

Однако с WebSockets последующие сообщения имеют небольшой размер и имеют только 6 байт служебных данных (2 для заголовка и 4 для значения маски).

Таким образом, WebSockets лучше подходят для передачи данных в реальном времени и особенно подходят для приложений с малой задержкой, поскольку накладные расходы меньше.

Подключение через WebSocket

Открыть соединение WebSocket просто. Если вам нужно указать подпротоколы, это также можно сделать с помощью второго параметра.

После создания сокетного соединения вы можете присоединить к нему обработчики событий, что позволит вам узнать, когда соединение открыто, когда оно получает сообщения и когда возникает ошибка.

Как только соединение будет установлено, в экземпляре WebSocket будет запущено событие onopen. И это знаменует собой завершение рукопожатия. С этого момента любая из сторон может отправлять данные в любое время. Когда WebSocket получает данные на стороне клиента, запускается событие onmessage. Событие onerror может использоваться для обработки ошибок.

Вы можете спросить, а что в этом нового? Разве мы не всегда так поступаем, устанавливая соединение и прослушивая сообщения?

При использовании WebSockets важно, как мы обрабатываем соединение.

От того, как мы будем обрабатывать соединение и повторить попытку при ошибках соединения, также будет зависеть общая отказоустойчивость связи.

Повторная попытка подключения для обеспечения отказоустойчивости

Распространенная проблема при работе с WebSockets - это разорванные соединения. Это происходит, когда клиент или сервер не отвечает. Чтобы избежать каких-либо проблем, связанных с этим, вы должны реализовать механизм для корректного закрытия соединения. Особенно если срок службы соединения WebSocket длительный, для обеспечения бесперебойной системы связи необходимо внедрять метод обновления соединений (закрывать и снова открывать соединения) время от времени.

Масштабирование подключений

Поскольку для WebSockets требуется высокая доступность из-за постоянных подключений, сервер должен быть масштабируемым, чтобы удовлетворять высокий спрос, когда это необходимо. Однако после открытия ws connection большую часть времени оно будет бездействовать.

Таким образом, вы можете задаться вопросом, как нам масштабировать серверную часть Websocket?

Масштабирование серверной части WebSocket - сложная задача, которая потребует постоянного хранилища (также известного как объединительная плата) для отслеживания подключений и доставленных сообщений, если какой-либо серверный узел выходит из строя.

Кроме того, было бы лучше реализовать стратегию горизонтального масштабирования с учетом количества открытых подключений.

Поскольку большинство пользователей могут не часто повторно подключаться, улучшение масштабируемости на основе открытых подключений имеет гораздо больший смысл.

Совет: создавайте приложения иначе

Инструменты OSS, такие как Bit, предлагают новую парадигму для создания современных приложений.

Вместо того чтобы разрабатывать монолитные проекты, вы сначала создаете независимые компоненты. Затем вы собираете свои компоненты вместе, чтобы создать столько приложений, сколько захотите. Это не только более быстрый способ сборки, но и более масштабируемый, он помогает стандартизировать разработку.

Это весело, попробуй

Шаблоны передачи данных

При передаче данных через веб-сокеты можно учитывать разные закономерности. Вы можете либо передать сообщение напрямую через WebSockets, либо отправить уведомление клиенту с указанием доступности сообщения.

WebSockets для отправки уведомлений для веб-приложений

Отправка уведомлений в приложении - распространенный вариант использования WebSockets. Соединение WebSocket используется только для предупреждения браузера о наличии нового сообщения.

Как только пользователь получает уведомление и посещает страницу уведомлений, приложение может отправить HTTP-запрос для получения содержимого сообщения.

Таким образом, в этом подходе WebSocket не отправляет фактическое содержимое сообщения и используется в качестве сигнального механизма для информирования внешнего интерфейса о доступности уведомлений.

Использование WebSockets для передачи данных в реальном времени

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

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

Сжатие данных

С помощью WebSockets сжатие - это не та тема, которая часто обсуждается. Но если необходимо отправлять большие объемы данных в режиме реального времени, полезно использовать метод сжатия.

Однако, чтобы добиться сжатия данных с помощью WebSockets, и клиент, и сервер должны согласиться с этим.

Знаете ли вы, что WebSockets предоставляет расширение для сжатия данных?

Когда клиент инициирует согласование, объявляя расширение permessage-deflate в заголовке Sec-Websocket-Extensions, сервер должен подтвердить объявленное расширение, повторив его в своем ответе.

Инициирование клиента:

GET /socket HTTP/1.1
Host: thirdparty.com
Origin: http://example.com
Connection: Upgrade
Upgrade: websocket
Sec-WebSocket-Version: 13
Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
Sec-WebSocket-Extensions: permessage-deflate

Ответ сервера:

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Access-Control-Allow-Origin: http://example.com
Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=
Sec-WebSocket-Extensions: permessage-deflate

Безопасность веб-сокетов

WebSockets позволяет неограниченному количеству сообщений достигать сервера. Это может легко дать злоумышленнику доступ для выполнения DoS-атаки.

Следовательно, важно использовать механизм аутентификации для обеспечения безопасности. Одним из распространенных способов использования является использование токенов JWT, которые ускоряют проверку подписи запроса.

Кроме того, жизненно важно использовать wss вместо ws, который будет защищать туннель связи, аналогичный HTTPS.

Совместимость с браузером

WebSockets имеют хорошую совместимость практически со всеми браузерами.

Кроме того, у WebSockets есть встроенная связь между источниками. Он позволяет общаться с любой стороной в любом домене. Это можно контролировать, определяя домены, с которыми сервер может взаимодействовать, что увеличивает безопасность.

Кроме того, популярные реализации WebSockets, такие как socket.IO (NodeJS) или SignalR (.NET), поддерживают откат к HTTP в старых браузерах.

Заключение

Когда вам нужно более качественное соединение с низкой задержкой между клиентом и сервером, WebSockets - ваш лучший вариант.

Однако интеграция WebSockets в существующую веб-инфраструктуру может вызывать затруднения, поскольку для этого требуется изменение архитектуры. Кроме того, вы также можете взглянуть на шаблон Event Sourcing, который эффективно использует WebSockets для связи.

Дайте мне знать любые дополнительные подробности, которые вы хотели бы знать о WebSockets, в комментариях ниже. Вы можете посмотреть демонстрацию подключения WebSocket здесь.

Спасибо за прочтение.

Учить больше