Що таке long-polling, websockets, sse і comet

Нещодавно один з передплатників запитав, як працюють повідомлення вконтакте? Або інших високонавантажених проектах, адже вони приходять миттєво і, якщо використовувати звичайний ajax, то сервер досить швидко впаде. Ось про те, які існують способи реалізації даного функціоналу, ми і поговоримо в сьогоднішній статті.

Для початку розглянемо, як взагалі йде http запит при звичайній роботі

Regular http

1. Клієнт посилає запит на веб-сторінку до сервера

2. Сервер формує відповідь

3. Сервер посилає відповідь клієнту

AJAX Polling

1. Клієнт посилає запит на веб-сторінку сервера, використовуючи звичайний http(Regular http)

2. Запрошення сторінка виконує jаvascript, який запитує файл від сервера через якийсь період часу (наприклад, 0.5 секунд)

3. Сервер формує відповідь для кожного запиту і відсилає його назад

Відео: HTTP Long Polling vs Streaming

AJAX Long-Polling

1. Клієнт запитує сторінку у сервера, використовуючи звичайний http

Відео: 17 - Web-технології. Real Time повідомлення

2. Запрошення сторінка виконує jаvascript, який запитує файл від сервера.

3. Сервер НЕ реагує на запитану інформацію і чекає, поки не з`явиться нової інформації

4. Коли з`являється нова інформація, сервер відсилає її клієнту

5. Клієнт отримує нову інформацію і НЕГАЙНО відсилає інший запит серверу, запускаючи процес очікування на ньому знову.

HTML5 Server Sent Events (SSE)

1. Клієнт запитує сторінку у сервера, використовуючи звичайний http

2. Запрошення сторінка виконує jаvascript, який відкриває з`єднання з сервером

3. Сервер посилає подія клієнту, коли з`являється нова інформація

• Трафік в реальному часі від сервера клієнту, головним чином, те, що вам потрібно
• Ви захочете використовувати сервер, який має цикл подій
• Немає можливості з`єднатися з сервером з іншого домену

HTML5 WebSockets

1. Клієнт запитує сторінку у сервера, використовуючи звичайний http

Відео: Лекція 15: Передача даних в сторінку, AJAX, Websockets, Server Sent Events

2. Запрошення сторінка виконує jаvascript, який відкриває з`єднання з сервером

3. Сервер і клієнт можуть посилати один одному повідомлення, коли нова інформація доступна (або на сервері, або на клієнті)

• Трафік в реальному часі від сервера до клієнта і від клієнта до сервера
• Ви захочете використовувати сервер, який має цикл подій
• Є можливість з`єднатися з сервером з іншого домену
• Є можливість використовувати третю сторону веб-сокет сервера, наприклад, Pusher

Відео: Websocket long polling

Comet

Comet - це колекція технік, які були до HTML5 і які використовують потокову передачу і довгостроковий опитування для досягнення додатки, що працює в реальному часі.

Отже, ми розглянули можливі способи реалізації даного функціоналу. У кожного способу є як свої плюси, так і свої мінуси. Однак, зараз кращим та динамічним способом вважається WebSockets. Але пам`ятайте, що HTML5 підтримують тільки сучасні браузери і про старі, на жаль, доведеться забути, якщо ви будете використовувати сокети.

Найближчим часом я буду писати статті про кожен із цих способів, так що підписуйтесь на оновлення сайту, щоб не пропустити! :)

Дякую за увагу і вдалого вам кодинга!