InterLink Meetup: Let’s chat? Realtime updates

Название митапа полностью себя оправдало 😀. Мы здорово пообщались в чате и в перерывах на кофе. И конечно же, познакомились WebSocket протоколом.

Для начала вспомнили разницу между синхронными и асинхронными запросами в браузере. Рассмотрели их на примере двух черкасских форумов. В ветке форума пользователь переключается между страницами ответов. Следующую страницу можно загрузить в фоне (асинхронный запрос). Но случится это только после действия пользователя.

А вот в чате мы обмениваемся сообщениями в режиме реального времени. Наш собеседник может в любой момент отправить новое сообщение и мы должны увидеть его на странице. До появления WebSocket для этого использовали несколько техник. Мы рассмотрели две из них: preriodical requests и long polling reqests.

После перерыва на кофе и интерактива от Насти, мы взялись за разбор WebSocket протокола.

После открытия TCP соединения клиент отправляет на сервер HTTP GET запрос с просьбой перейти на обмен WebScoket сообщениями. И сервер, вы не поверите, отправляет HTTP ответ :). То есть, начало работы по протоколу WebSocket осуществляется через HTTP протокол. Такое “рукопожатие” (handshake) позволяет обрабатывать WebSocket соединения на том же порту, что и HTTP. Но в отличие от HTTP, соединение не закрывается после полученного ответа. Оно остается открытым и клиент с сервером продолжают обмениваться сообщениями. Теперь уже в обе стороны.

Сами сообщение имеют фиксированный бинарный формат. С каждым сообщением предаётся всего от 2-х до 12-х служебных байтов (message overhead). Все остальное – ваши полезные данные (payload). Это в 250 раз меньше, чем обычный HTTP запрос. Таким образом, обмен данными через WebSocket потребляет меньше трафика.

Использование WebSocket на практике мы разобрали на примере простенького чата. Это был одна общая анонимная чат-комната. Все гости могли открыть его на телефоне.

Новые сообщения сразу появлялись в браузере на проекторе. Анонимность и публичность сообщений вернула гостей в детство, когда они оставляли послания на заборах :). Посмотрите код чата в репозитории. Обмен сообщениями через WebSocket делается в пару строк кода. Это совсем не сложно.

Гости и я лично остались довольны митапом. Мы вложились в тайминг, узнали что-то новое и весело провели время.

Больше фото с ивента тут ;).

Спасибо всем, кто пришел и сделал этот вечер 👍. До новых встреч на следующем митапе 😏.

Post A Reply