在淘汰应用程序中使用setInterval进行轮询实现?

时间:2016-07-26 06:24:04

标签: javascript jquery ajax knockout.js

我正在尝试使用setInterval实现简单的轮询机制。我有一个Viewmodel如下:

define([ 'knockout', 'jquery',
    ], function ( ko, $) {
    function ViewModel() {
        var self = this;
        //setInterval( function() {
        $.ajax({url: "", async: false,timeout: 3000, success: function (data) {
           // some operation

            }, dataType: "json"});
      //}, 3000);

    }
    return ViewModel;


 });

到此为止它可以正常工作ajax调用返回数据并进行操作。如何使用setInterval使ajax调用在一定时间间隔后返回数据,以便更新ViewModel并在UI中刷新数据?如果我取消注释setInterval块,那么ViewModel不会返回到DOM。我认为setInterval是异步的。任何解决方案都表示赞赏。

2 个答案:

答案 0 :(得分:1)

基本上,将setInterval与异步代码一起使用并不是最好的方法。最好使用setTimeout在上一个请求完成后安排新请求。

如果您确保一次只能处理两个待处理请求,则可以通过成功处理程序中的ViewModel访问self实例,您不必担心旧的/其他请求撤消您的更改。

以下是一个例子:



function ViewModel() {
  var self = this;

  var INTERVAL = 5000;
  var timeout = null;
  var currentReq = null;
  
  this.observableProp = ko.observable("empty");

  var fetchNewData = function() {
    currentReq = $.ajax( /* options */);
    
    currentReq
      .done(processNewData)
      .always(scheduleNewDataFetch);
  };

  var processNewData = function(data) {
    // self refers to your current ViewModel instance
    // set observable properties using self.prop(data)
    self.observableProp("data");
  };
  
  var scheduleNewDataFetch = function() {
    if (currentReq) {
      currentReq.abort();  
    }
    
    if (timeout) {
      clearTimeout(timeout);  
    }
    
    currentReq = null;
    timeout = setTimeout(fetchNewData, INTERVAL);
    
  };

  fetchNewData(); // Starts the update loop
}




答案 1 :(得分:-1)

你可以尝试简单地做:

define([ 'knockout', 'jquery',
    ], function ( ko, $) {
    function ViewModel() {
        var self = this;
        var refreshInterval = /* your refresh interval in ms here*/;
        setInterval( function() {
            $.ajax({url: "", async: false, success: function (data) {
                // some operation

                timeout: refreshInterval
                }, dataType: "json"});
        }, refreshInterval);

    }
    return ViewModel;

 });

每隔refreshInterval(以毫秒为单位)进行ajax调用。 timeout属性是一种安全措施,可确保您在一个时间间隔内获得的答案是此时间间隔的数据,而不是来自之前未应答的呼叫的数据。