如何设置获取此 websockets 数据的时间间隔?

Posted

技术标签:

【中文标题】如何设置获取此 websockets 数据的时间间隔?【英文标题】:how to set the interval at which this websockets data is fetched? 【发布时间】:2021-11-25 09:44:42 【问题描述】:

这是代码--->

const delay = 5000;
    
let ws = new WebSocket('wss://stream.binance.com:9443/ws/ethusdt@trade');
let priceElement1 = document.getElementById('ethprice');
let lastPrice1 = null

ws.onmessage = (event) => 
    let stockObject = JSON.parse(event.data);
    let price = parseFloat(stockObject.p).toFixed(2);
    priceElement1.innerText = price;
    priceElement1.style.color = !lastPrice1 || lastPrice1 === price ? 'white' : price > lastPrice1 ? '#AAFF00' : 'red';
    lastPrice1 = price;
;

我试图让它不是每 1ms 向元素传输数据,而是每 5000ms 执行一次。

这是我的第一个堆栈溢出帖子,如果它不好,我几个月前才开始接触 html css 和 js,我正在努力解决更困难的任务。

谢谢!

【问题讨论】:

【参考方案1】:

一般情况下,websocket 数据不会被获取,而是在服务器发送后立即接收。这就是为什么首先使用 websockets 而不是其他方法(如 ajax 轮询)。

在您的情况下,您可以简单地将传入消息保存到一个变量中,并且每 5 秒检查一次该变量的更新。 这可能如下所示:

const delay = 5000;

let ws = new WebSocket('wss://stream.binance.com:9443/ws/ethusdt@trade');
let priceElement1 = document.getElementById('ethprice');
let lastPrice1 = null
let stockObject = null;

ws.onmessage = (event) => 
    stockObject = JSON.parse(event.data);
;

setInterval(() => 
    if(stockObject === null) 
        return;
    
    let price = parseFloat(stockObject.p).toFixed(2);
    priceElement1.innerText = price;
    priceElement1.style.color = !lastPrice1 || lastPrice1 === price ? 'white' : price > lastPrice1 ? '#AAFF00' : 'red';
    lastPrice1 = price;
    stockObject = null;
, delay);

【讨论】:

以上是关于如何设置获取此 websockets 数据的时间间隔?的主要内容,如果未能解决你的问题,请参考以下文章

使用 .Net ClientWebSocket 从 WebSocket 获取数据

如何从 SESSID 获取 $_SESSION 数据?

如何从 websocket url 获取数据?

Jmeter设置websocket长时间连接

您如何将 websocket 设置为外部 API?

如何确保 WebSocket 的 readyState 变为 CLOSED(3)?