时间戳

首页 > 解决方案 > 2个websockets之间的冲突

javascript - 2个websockets之间的冲突

问题描述

我一直在尝试创建一个根据用户偏好显示比特币和以太坊价格的脚本。因此，如果用户点击比特币按钮，它会显示比特币价格，当用户点击以太坊按钮时，它会显示以太坊。

一切正常，但是当您单击比特币按钮，然后单击以太坊按钮时，它会产生冲突并不断在比特币和以太坊价格之间切换。

我试过用

价格Ws1.close(); 和价格Ws.close(); 但它完全关闭了 1 个 websocket，您无法在价格之间进行交换。

Javascript

const pricesWs = new WebSocket('wss://ws.coincap.io/prices?assets=bitcoin')
 const pricesWs1 = new WebSocket('wss://ws.coincap.io/prices?assets=ethereum')  
 
 $(document).ready(function() {
    $('.buttonbtc').click(function(e) {  

pricesWs.onmessage = function (msg) {

        var str = msg.data                                      
    var matches = str.match (/\b\d+(?:.\d+)?/);
    var finalprice = parseFloat(matches);
     document.getElementById("btc").innerHTML = finalprice;
     
}

   });
});

 $(document).ready(function() {
    $('.buttoneth').click(function(e) {  
    
pricesWs1.onmessage = function (msgg) {
    
    var str = msgg.data                                      
    var matches = str.match (/\b\d+(?:.\d+)?/);
    var finalprice = parseFloat(matches);
    document.getElementById("btc").innerHTML = finalprice;
}

   });
});

现场演示：https://jsfiddle.net/s9rv1agu/

标签： javascriptapiwebsocketcryptocurrency

解决方案

问题似乎是您从 coinbase 服务器收到持续的响应消息。您可以阻止文本显示在消息上更新，除非发送它的套接字与最后单击的按钮匹配。

在这种情况下，我将上次单击按钮的值存储在名为 cp 的变量中，并且仅在消息由相应的套接字发送时才更新消息的显示。

代码：

    const pricesWs = new WebSocket('wss://ws.coincap.io/prices?assets=bitcoin')
     const pricesWs1 = new WebSocket('wss://ws.coincap.io/prices?assets=ethereum');
     
     var cp = -1;//current_price
     
     $(document).ready(function() {
        $('.buttonbtc').click(function(e) {  
    
     cp = 0;
     document.getElementById("btc").innerHTML = "pending...";
    pricesWs.onmessage = function (msg) {
    
         if(cp == 0) {
            var str = msg.data                                      
        var matches = str.match (/\b\d+(?:.\d+)?/);
        var finalprice = parseFloat(matches);
         document.getElementById("btc").innerHTML = finalprice;
    }
         
    }
    
       });
    });
    
    
     $(document).ready(function() {
        $('.buttoneth').click(function(e) {  
        
    cp = 1;
    document.getElementById("btc").innerHTML = "pending...";
    pricesWs1.onmessage = function (msgg) {
        if(cp == 1) {
        var str = msgg.data                                      
        var matches = str.match (/\b\d+(?:.\d+)?/);
        var finalprice = parseFloat(matches);
    
        document.getElementById("btc").innerHTML = finalprice;
        }
    }
    
       });
    });

但是，如果您还想停止问题的根本原因（服务器发送的持续消息），您将需要启动套接字连接并在消息后关闭连接（或者可能使用 coinbase 的某些配置，只会发回1 条消息）。

var pricesWs;
var pricesWs1;

const wlist = ['wss://ws.coincap.io/prices?assets=bitcoin',
             'wss://ws.coincap.io/prices?assets=ethereum'];
 
 var cp = -1;//current_price
 
 $(document).ready(function() {
    $('.buttonbtc').click(function(e) {  

 cp = 0;
 document.getElementById("btc").innerHTML = "pending...";
 pricesWs = new WebSocket(wlist[0]);
  pricesWs.onopen = function() {
pricesWs.onmessage = function (msg) {

     if(cp == 0) {
        var str = msg.data                                      
    var matches = str.match (/\b\d+(?:.\d+)?/);
    var finalprice = parseFloat(matches);
     document.getElementById("btc").innerHTML = finalprice;
}
     pricesWs.close();
}
}

   });
});


 $(document).ready(function() {
    $('.buttoneth').click(function(e) {  
    
cp = 1;
document.getElementById("btc").innerHTML = "pending...";
 pricesWs1 = new WebSocket(wlist[1]);
 pricesWs1.onopen = function() {
pricesWs1.onmessage = function (msgg) {
    if(cp == 1) {
    var str = msgg.data                                      
    var matches = str.match (/\b\d+(?:.\d+)?/);
    var finalprice = parseFloat(matches);

    document.getElementById("btc").innerHTML = finalprice;
        }
    pricesWs1.close();
    }
}

   });
});

还可以添加额外的检查以确保单击按钮时套接字不在打开的过程中

推荐阅读