javascript - 如何打开多个 WebSocket 流
问题描述
我正在尝试从 Binance WebSocket API 流式传输数据,我让它一次为一个符号工作。
if ("WebSocket" in window) {
//open websocket
var symbols = getSymbol();
//console.log(symbols);
symbols.forEach(function(entry) {
console.log(entry);
})
var ws = new WebSocket("wss://stream.binance.com:9443/ws/btcusdt@miniTicker")
ws.onopen = function() {
console.log("Binance connected...");
};
ws.onmessage = function(evt) {
var r_msg = evt.data;
var jr_msg = JSON.parse(r_msg);
}
ws.onclose = function() {
console.log("Binance disconnected");
}
} else {
alert("WebSocket is NOT supported");
}
var 行symbols = getSymbol();
创建了一个包含 431 个符号的数组,我的逻辑(以及我想要实现的)是将其添加new websocket()
到 forEach 并从所有货币对中流式传输价格数据。
我不确定这是否可能,或者有什么更好的解决方案,但我希望流式传输和显示来自 api 的实时数据。
解决方案
您关于将new WebSocket()
内部放入 for-each 的想法应该可行。但是,我不确定是否允许您从同一个选项卡打开数百个 Web 套接字,并且还可能存在一些与之相关的性能问题。
根据API 文档,可以只打开一个 Web 套接字,该套接字将向您发送来自流列表甚至所有流的数据。只需像这样构造 URL:
- 具体流:wss://stream.binance.com:9443/ws/ stream1 / stream2 / stream3
- 所有流:wss://stream.binance.com:9443/ws/!miniTicker@arr
这是一个考虑到这些因素的代码示例。默认情况下,此代码使用所有流的 URL,但它也有使用特定流的代码(已注释掉)。
let streams = [
"ethbtc@miniTicker","bnbbtc@miniTicker","wavesbtc@miniTicker","bchabcbtc@miniTicker",
"bchsvbtc@miniTicker","xrpbtc@miniTicker","tusdbtc@miniTicker","eosbtc@miniTicker",
"trxbtc@miniTicker","ltcbtc@miniTicker","xlmbtc@miniTicker","bcptbtc@miniTicker",
"adabtc@miniTicker","zilbtc@miniTicker","xmrbtc@miniTicker","stratbtc@miniTicker",
"zecbtc@miniTicker","qkcbtc@miniTicker","neobtc@miniTicker","dashbtc@miniTicker","zrxbtc@miniTicker"
];
let trackedStreams = [];
//let ws = new WebSocket("wss://stream.binance.com:9443/ws/" + streams.join('/'));
let ws = new WebSocket("wss://stream.binance.com:9443/ws/!miniTicker@arr");
ws.onopen = function() {
console.log("Binance connected...");
};
ws.onmessage = function(evt) {
try {
let msgs = JSON.parse(evt.data);
if (Array.isArray(msgs)) {
for (let msg of msgs) {
handleMessage(msg);
}
} else {
handleMessage(msgs)
}
} catch (e) {
console.log('Unknown message: ' + evt.data, e);
}
}
ws.onclose = function() {
console.log("Binance disconnected");
}
function handleMessage(msg) {
const stream = msg.s;
if (trackedStreams.indexOf(stream) === -1) {
document.getElementById('streams').innerHTML += '<br/>' + stream + ': <span id="stream_' + stream + '"></span>';
trackedStreams.push(stream);
document.getElementById('totalstreams').innerText = trackedStreams.length;
}
document.getElementById('stream_' + stream).innerText = msg.v;
}
<span id="totalstreams"></span> streams tracked<br/>
Total traded base asset volume:<br/>
<div id="streams"></div>
推荐阅读
- javascript - 我想在 tensorflow 数据集中添加更多数据?我的应用程序使用 java 在 android 上构建
- python - 使用线程时未触发 Pyttsx3 回调
- c++ - 从已知大小和一些索引字符的文件中搜索字符串
- javax.imageio - 编写大图像精灵表
- drupal - 如何通过预处理主题功能将放置在树枝文件中的块限制为内容类型中的某些页面?
- ocaml - 如何从同一模块返回一流模块?
- azure - 如何在 azure board 中的 bug 下拉列表中填充找到的内容
- android - Android 以编程方式添加的视图未在 UI 中显示
- symfony - 当数据在 Symfony 中作为数组传递时,如何在验证组件中使用 EqualTo 约束?
- ios - PHAssetResourceManager writeData 返回错误 1