Question

我有这个javascript代码，其中setInterval()每2秒触发一次，以更新var kraken_btc_eur

但是，有时从API检索的变量不会改变。因此，为了节省一些服务器处理，我想避免触发setInterval操作。

也许我问的是没有意义的，只是为了优化。

感谢您的指导。

var kraken_btc_eur_old = 0;

setInterval(function(){

    $.get('https://api.kraken.com/0/public/Ticker?pair=XXBTZEUR', function(data){ 

        var kraken_btc_eur = data.result.XXBTZEUR.c[0]; //get the value of 1 bitcoin
        //some logic to change the css if the value increased or decreased
        if (kraken_btc_eur_old > kraken_btc_eur) {

            $(".kraken_btc_eur").css('color', 'red').text(kraken_btc_eur);
        } else {
            $(".kraken_btc_eur").css('color', 'green').text(kraken_btc_eur);                
        }

        kraken_btc_eur_old = kraken_btc_eur; //set the global variable to the value of 1 bitcoin so that in 2 sec it will be checked in the if statement
        $(".kraken_btc_eur").text(kraken_btc_eur); //show the value to the user to the html tag with the corresponding class

    });

}, 2000);

Answer 1

使用setInterval，您正在使用一种称为短轮询的方法。这是当您不断从服务器请求数据以确定是否有任何更改时。

短轮询有两种主要的替代方案。其中，我相信您正在寻找WebSockets，它本质上是可以与JavaScript一起使用的套接字。 WebSockets允许您将未格式化的数据从客户端传递到服务器，反之亦然。使用WebSockets，您的服务器必须保持对客户端的开放套接字，但只有在服务器端发生更改时才会向客户端发送数据。

当然，这是假设您是API的开发者。

如果没有，你将不得不坚持短暂的民意调查。您可以采用一种方法，如果API的值暂时不变，您可以降低短轮询的频率 - 但这需要您从setInterval切换到setTimeout。在回调中，您可以确定当前回调和下一个回调之间的新超时。

这种方法如下所示：

setTimeout(function callback(timeout){

  // .. get request here

  if(timeout !== undefined)
  {
    if(kraken_btc_eur == kraken_btc_eur_old)
    {
      timeout = Math.min(10000, timeout + 1000);
    }
    else
    {
      timeout = 2000;
    }
  }
  else
  {
    timeout = 2000;
  }

  setTimeout(callback.bind(window, timeout), timeout);
}, 2000);

Answer 2

我相信kraken api有一个etag标题不太确定。您可以检查etag与旧etag是否相同意味着数据没有变化。

一些参考。 http://www.websiteoptimization.com/speed/tweak/etags-revisited/ https://www.infoq.com/articles/etags

如果您可以选择设置websocket，那就更好了。检查https://socket.io/。

Answer 3

您可以在代码中进行一些更改

var window.kraken_btc_eur_old = 0;

function makeRequest(oldValue) {

   $.get('https://api.kraken.com/0/public/Ticker?pair=XXBTZEUR', 
   function(data){ 

       var kraken_btc_eur = data.result.XXBTZEUR.c[0]; 
       if(kraken_btc_eur !== oldValue){

          //get the value of 1 bitcoin
          //some logic to change the css if the value increased or decreased
          if (oldValue > kraken_btc_eur) {
              $(".kraken_btc_eur").css('color', 'red').text(kraken_btc_eur);
          } else {
              $(".kraken_btc_eur").css('color', 'green').text(kraken_btc_eur);                
          }

          window.kraken_btc_eur_old = kraken_btc_eur; 

          //set the global variable to the value of 1 bitcoin so that in 2 sec it will be checked in the if statement

          $(".kraken_btc_eur").text(kraken_btc_eur); //show the value to the user to the html tag with the corresponding class
          }
      });
}


setInterval(makeRequest.bind(null,window.kraken_btc_eur_old), 2000);

我写过window.kraken_btc_eur_old只是为了让你明白它是一个全球性的对象

仅在值更改时触发setinterval（）

3 个答案: