Websocket

Realtime Data Updates in Apeekflow

В эпоху цифровых технологий скорость и оперативность являются ключевыми факторами успеха. Вот почему мы считаем, что наш источник данных WebSocket является отличным дополнением. Но почему это так сильно меняет правила игры?

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

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

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

• Возможности WebSockets безграничны: от приложений для онлайн-чата до игр в реальном времени, систем отслеживания и мониторинга - возможности WebSockets огромны. С нашим источником данных WebSocket вы не просто будете в курсе последних событий, но и откроете целый мир возможностей для своих приложений в режиме реального времени.

Использование WebSocket в качестве источника данных

Сначала выберите Потоковый запрос в качестве нового запроса из доступных источников данных. Потоковый запрос доступен в Apeekflow версии 2.1.0.

Подключение к серверу WebSocket

В качестве URL-адреса введите адреса сервера WebSocket ws:// (без) и wss:// (с защищенным SSL-соединением). С момента запуска этого запроса Apeekflow пытается установить соединение с сервером WebSocket. В случае успеха особенность подключений WebSocket заключается в том, что они остаются активными и открытыми до тех пор, пока вы не отключите приложение Dataquery / Apeekflow.

https://www.piesocket.com — сервис, который вы можете использовать для установки и использования серверов WebSocket.

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

// for example wss://ws.kraken.com

Прием и широковещательная передача сообщений

Теперь подключение установлено, и, в зависимости от канала, вы уже можете получать данные. Однако довольно часто бывает так, что Клиенту необходимо подписаться на определенную тему или комнату. Для этого, а также просто для трансляции сообщения в соединение, вы можете использовать новую функцию broadcast(); Это функция запроса источника данных / потока WebSocket.

Вот пример в виде JavaScript, который вызывается, как только потоковый запрос успешно подключается к серверу WebSocket и прослушивается в канале.

Сообщения поступают и транслируются в формате JSON.

// for example:

krakenStockTicker.broadcast({
  "event": "subscribe",
  "pair": [
    "EUR/USD"
  ],
  "subscription": {
    "name": "ohlc"
  }
});

Обработка входящих сообщений

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

Мы используем триггер успех потокового запроса и устанавливаем временное состояние со значением. В специальном случае Kraken Websocket мы хотим пропустить все сообщения о сердцебиении, поэтому мы устанавливаем временное состояние только в том случае, если в текущем сообщении есть полезные данные.

Сбор сообщений

В вашем сценарии приложения может быть полезно собирать сообщения, например, для отображения диаграммы в виде скользящего окна, подобной этой диаграмме OHLC в нашем примере. Для этого мы создаем, например, массив, который доступен для всего приложения.

window.krakenStockTickerData = [];

Теперь мы можем привязать обработку Javascript для каждого входящего сообщения к триггеру успех потокового запроса и привязать нашу диаграмму к этому массиву данных.

// мы берем строковое значение сообщения Websocket и создаем массив
const currentRawTickerData = currentTickerData.value.split(',');
// теперь, основываясь на массиве, мы можем извлечь нужные нам данные и сформулировать объект JSON
const currentCleanTickerData = {
  "time" : new Date(currentRawTickerData[0].substr(0,10) * 1000).toISOString().substr(11, 8),
  "duration" : new Date(currentRawTickerData[1].substr(0,10) * 1000).toISOString().substr(11, 8),
  "open" : currentRawTickerData[2],
  "high" : currentRawTickerData[3],
  "low" : currentRawTickerData[4],
  "close" : currentRawTickerData[5],
  "weighted_volume" : currentRawTickerData[6],
  "accumulated_volume" : currentRawTickerData[7],
  "trades" : currentRawTickerData[8]
}
// мы помещаем новый объект в массив, krakenStockTickerData
window.krakenStockTickerData.push(currentCleanTickerData);
// и мы следим за тем, чтобы старые данные были удалены, чтобы массив не стал слишком большим
while (window.krakenStockTickerData.length > 30) {
  window.krakenStockTickerData.shift();
}
// Здесь мы устанавливаем значение во временном состоянии, чтобы диаграммы обновляли свою визуализацию
// (привязка к массиву в window-object не запускает триггер для повторного отображения электронных диаграмм)
clockTickerData.setValue(currentCleanTickerData.time);