Как мы можем поддерживать информацию о наших приложениях в актуальном состоянии, в режиме реального времени, без постоянного опроса сервера?

В основе этой концепции лежит несколько технологий, включая WebSockets или более сложные протоколы, такие как MQTT.

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

События, отправленные сервером

Браузер Web API Server Sent Events имеет интерфейс JavaScript EventSource, который позволит вам подписаться на текст/поток событий и передавать эти события в ваше веб-приложение.

Традиционно веб-страница должна отправить запрос на сервер для получения новых данных; то есть страница запрашивает данные с сервера. С помощью событий, отправляемых сервером, сервер может отправлять новые данные на веб-страницу в любое время, отправляя сообщения на веб-страницу. Эти входящие сообщения можно рассматривать как События + данные внутри веб-страницы.

Получение событий

Чтобы получать события, все, что вам нужно сделать, это указать объекту EventSource URL-адрес страницы text/event-stream и реализовать прослушиватели для интересующего вас типа события.

Предупреждение. Когда не используется через HTTP/2, SSE имеет ограничение на максимальное количество открытых подключений, что может быть особенно болезненным при открытии нескольких вкладок, поскольку ограничение для каждого браузера и имеет очень маленькое значение (6). Проблема отмечена как Не исправим в Chrome и Firefox. Это ограничение на браузер + домен, что означает, что вы можете открыть 6 подключений SSE на всех вкладках к www.example1.com и еще 6 подключений SSE к www.example2.com (на Stackoverflow). При использовании HTTP/2 максимальное количество одновременных HTTP-потоков согласовывается между сервером и клиентом (по умолчанию 100).

Отправка событий

Только сервер может отправлять события, это не улица с двусторонним движением.

Не только тип MIME должен быть text/event-stream, но и каждое уведомление отправляется в виде блока текста, заканчивающегося парой символов новой строки.

Грубый пример кода NodeJ для генерации сообщения будет выглядеть так:

Если вы укажете свой браузер прямо на такую ​​страницу, вы получите это в качестве примера:

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

Вы можете подписаться на несколько событий, например «est» или «pdt» или оба в примерах.

Независимо от того, на что вы подписаны, вы всегда будете получать «сообщение» или неуказанные события.

Реализация внешних систем

Реализовать это в OutSystems очень просто.

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

Работа с JavaScript

Мы создаем экземпляр EventSource, сопоставляющий прослушиватели событий с методами запуска событий в нашем приложении:

И мы публикуем эти события на OnDestroy:

Демонстрационное приложение

Я придумал самую простую, но наименее полезную демонстрацию.

Серверная сторона каждую секунду отправляет дату UTC для неопределенного события, а также событие «est» с датой перехода на восточное летнее время и, наконец, событие «pdt» с датой перехода на летнее время по тихоокеанскому времени.

Блок EventSource настроен на подписку на мою страницу text/event-stream, созданную в NodeJs, и я также хочу подписаться как на «est», так и на «pdt».

Затем реализуем обработчики событий:

Результатом является веб-страница, которая показывает в реальном времени события даты, отправляемые сервером.

Приложения

Итак, где мы можем или должны использовать это?

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

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

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

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

Как обычно компонент и демо можно найти на кузнице вместе с еще парочкой по этой теме.

Теперь все, что вам нужно сделать, это зарегистрироваться на конференцию разработчиков OutSystems.

и, очевидно, пойти и создать несколько приложений.