Разница между Server-Sent-Events и WebSockets
На протяжении многих лет модель запроса-ответа HTTP использовалась для связи клиент-сервер в веб-приложениях. Однако с ростом популярности веб-приложений, работающих в режиме реального времени, возникла необходимость в том, чтобы серверы могли проактивно передавать данные клиентам без предварительного запроса клиентов.
В результате методы связи, основанные на технологии push, такие как WebSockets и Server-Sent Events (SSE), стали популярными среди разработчиков. Эти методы представляют собой типы связи в Интернете, когда сервер инициирует запрос на конкретную транзакцию.
Итак, в этой статье мы сравним и сопоставим WebSockets и Server-Sent Events, чтобы помочь вам выбрать лучший вариант для вашего проекта.
Веб-сокеты
WebSockets — это передовая технология, которая обеспечивает двустороннюю интерактивную связь в реальном времени между клиентом и сервером.
Это достигается определением стандартизированного механизма отправки сервером данных клиенту без предварительного запроса клиентом. После первого сообщения соединение будет оставаться открытым, что позволит клиенту и серверу поддерживать непрерывную двустороннюю связь без каких-либо перерывов.
WebSockets используют протокол WebSocket для связи. Соединение WebSocket начинается как обычное HTTP-соединение, которое преобразуется в соединение WebSocket посредством рукопожатия WebSocket. Рукопожатие начинается с отправки клиентом HTTP-запроса со специальным заголовком UPGRADE. Затем сервер получает запрос, обрабатывает его и переключается на протокол WebSocket, если запрос принят. Двусторонняя связь возможна, когда это рукопожатие завершено.
Преимущества
- WebSockets обеспечивают двустороннюю связь в реальном времени.
- Поскольку WebSockets обычно не используют «XMLHttpRequest», заголовки не предоставляются, когда нам нужны дополнительные данные сервера. В результате объем больших объемов данных, передаваемых на сервер, снижается.
- WebSockets позволяют отправлять данные в двоичном и текстовом форматах UTF-8. Отправка данных в двоичном формате может повысить эффективность передачи и интерпретации данных, поскольку при кодировании могут использоваться все значения байта.
- WebSockets поддерживают такие браузеры, как Google Chrome, Microsoft Edge, Opera, Firefox, Safari и другие.
- WebSockets может идентифицировать прерванное клиентское соединение.
- WebSockets очень надежны, поскольку они могут управлять обширными проектами.
Потенциальные недостатки
WebSockets имеют один существенный недостаток. Они не полностью работают поверх HTTP. Вместо этого им нужно их TCP-соединение для работы. Им просто нужен HTTP, чтобы инициировать соединение, а затем обновить его до автономного TCP-соединения, используемого с протоколом WebSocket.
Это может не показаться серьезной проблемой, но это означает, что WebSockets не могут использовать преимущества каких-либо функций HTTP:
- Нет поддержки сжатия.
- Мультиплексирование HTTP/2 не поддерживается.
- Прокси могут вызвать проблемы.
- Уязвим к межсайтовому захвату.
Также,
- Настройка WebSockets является более сложной и трудоемкой задачей, поскольку требует значительного объема предварительной работы.
- Соединения WebSocket не поддерживались в браузерах до 2011 года.
- Веб-сокеты не восстанавливаются автоматически при закрытых соединениях. Это должно быть выполнено вручную.
- WebSockets проблематичны для некоторых корпоративных брандмауэров с мониторингом пакетов (в частности, SophosXG Firewall, WatchGuard, McAfee Web Gateway).
События, отправленные сервером
SSE (Server-Sent Events) — это метод, который позволяет браузеру (клиенту) получать автоматические обновления с сервера, такие как текстовые данные о событиях, по стандартному HTTP-соединению.
Цель SSE — предоставить браузеру возможность беспрепятственно получать данные с сервера, не запрашивая их. Это спецификация, которая определяет, как серверы начинают отправлять данные клиентам после установления клиентского соединения. Чтобы оптимизировать кросс-браузерную потоковую передачу, они используют JavaScript API под названием EventSource для регистрации в источнике событий и передачи сообщений или непрерывных обновлений клиенту. Во время инициализации события источник события будет передаваться в EventSource API. Он будет контролировать подключение к источнику и автоматически отправлять изменения клиентам. Эта концепция делает работу с данными в реальном времени чрезвычайно эффективной, поскольку использует только одно продолжительное HTTP-соединение.
Преимущества
- Вместо использования специального протокола данные отправляются по протоколу HTTP.
- SSE можно «бэкпортировать» в браузеры, которые его еще не поддерживают, полигонируя его с помощью JavaScript.
- Встроенная возможность повторного подключения (когда сервер прерывает или закрывает соединение, клиент автоматически попытается восстановить соединение без участия пользователя).
- Мониторинг пакетов не является проблемой для корпоративных брандмауэров.
- Mozilla, Chrome и Safari — это браузеры, которые поддерживаются SSE.
- SSE быстрее и удобнее в настройке, чем WebSockets.
Потенциальные недостатки
- SSE может обрабатывать только символы UTF-8 и не поддерживает двоичные данные.
- Что касается максимального количества открытых подключений, у SSE есть ограничения. Однако ограничение для каждого браузера установлено на низкое значение. Эта ситуация приведет к неприятному опыту при открытии нескольких вкладок.
- SSE является односторонней технологией и не допускает двунаправленной передачи данных.
- В SSE поддержка браузера ограничена.
WebSockets и SSE: сходство
Вы, должно быть, заметили некоторое сходство между двумя технологиями, которые мы уже обсуждали, помимо того факта, что обе они используют HTTP-соединения. Наиболее очевидное сходство заключается в том, что они оба работают одинаково. Например, они используют процедуру, известную как отправка данных сервером для отправки данных с сервера клиенту.
WebSockets и SSE: различия
Существенная разница между обеими технологиями заключается в том, что WebSockets являются двунаправленными, а SSE — однонаправленными.
Так что, если вы хотите добавить в свое приложение функцию push-уведомлений сервера, оба варианта являются жизнеспособными вариантами для изучения. С другой стороны, WebSockets лучше удовлетворит ваши требования, если вы ищете метод двунаправленной связи.
Когда дело доходит до расширяемости, WebSockets намного сложнее и требует больше времени для настройки, чем SSE. Тем не менее, они создают очень надежную и расширяемую среду приложений. С другой стороны, SSE — более простой и быстрый подход, но ему не хватает расширяемости. Например, если требования вашего веб-приложения пересмотрены, вам придется провести его рефакторинг с использованием веб-сокетов, которые более гибки и способны обрабатывать сложные проекты.
Случаи использования
WebSockets. WebSockets широко используются и ценятся в технологических решениях, таких как опросы в реальном времени, чаты, медиаплееры, многопользовательские игры и т. д.
Отправленные сервером события. Во многих приложениях отправка данных от клиента не требуется. SSE особенно полезны в обновлениях статуса, новостных лентах социальных сетей, push-уведомлениях, информационных бюллетенях и т. д.
Заключение
В этой статье были выделены конкретные преимущества и недостатки двух технологий, WebSockets и SSE, путем их сравнения и противопоставления. Теперь, когда вы лучше их понимаете, вы можете выбрать тот, который лучше всего подходит для ваших нужд. Однако важно отметить, что они не являются конкурирующими технологиями, и ни одна из них не превосходит другую. Следует ли вам использовать WebSockets или SSE, зависит от личных предпочтений.
Я надеюсь, что вы нашли эту статью полезной. Спасибо за чтение!
Создавайте приложения с повторно используемыми компонентами, как Lego
Инструмент с открытым исходным кодом Bit помогает более чем 250 000 разработчиков создавать приложения с компонентами.
Превратите любой пользовательский интерфейс, функцию или страницу в компонент многократного использования — и поделитесь им со своими приложениями. Легче сотрудничать и строить быстрее.
Разделите приложения на компоненты, чтобы упростить разработку приложений, и наслаждайтесь наилучшими возможностями для рабочих процессов, которые вы хотите:
