2016-07-29 50 views
0

這是我的第一個問題,所以我會先說:大家好!使用AJAX連續進行數據庫調用JS

我正在嘗試使用直接的JavaScript和Ajax以幻想表的形式製作實時數據「演示文稿」,後端是PHP。爲了刷新表格,我需要在每一個請求,讓說3秒,4是好的。數據庫是RedisDB。我讓php腳本獲取數據並確定。我做了一個單一的JS文件來請求和處理/處理數據,這是好的。 該演示文稿看起來不錯,用JS編寫的算法效果極佳,大約有600行,一些簡單的if-else和其他更復雜的開關。

它現在變得討厭。我不能得到這樣的事情,我試着用setTimeout()和setInterval()方法來做這些事情,我用類似睡眠的函數做了定時器和無限循環等等,但是它只能在下一個請求中生存下來在頁面加載的初始後。

對於純JS,Ajax請求的代碼非常簡單。我得到我的JSON字符串數據用jsonParse()解析它,然後做我的數據處理。

這一切都有效,它是下一個失敗的請求,不管它是如何啓動的(用戶操作或其他)。

AJAX代碼:

window.onload = function(){ 
     getEventdataFromDB(); 
    } 

    function getEventdataFromDB(){ 

     var xmlhttp; 

     if(window.XMLHttpRequest){ 
      xmlhttp = new XMLHttpRequest(); 
     }else{ 
      xmlhttp = new ActiveXObject('Microsoft.XMLHTTP'); 
     } 


     xmlhttp.onreadystatechange = function(){ 
      if(xmlhttp.readyState == 4 && xmlhttp.status == 200){ 

       var dbData = xmlhttp.responseText; 

       if(dbData != ''){ 
        processEvents(dbData); //function for data processing 
       }  
      }    
     } 

     xmlhttp.open('GET','getEvents.php?dataRequest=true',true); 
     xmlhttp.send(); 

    } 

我知道這是一個有點罪的,這些天不跟隨的流量和使用jQuery等框架,但我只是上最新,最大的簡化並不大開始工作的東西很好。

什麼是最好的方式來做到這一點,我應該如何繼續,使用什麼。我做了一些研究,並指出了鏈接回調和Promise對象。

我是第一個這樣做的人,顯然沒有辦法,所以前進的方向是什麼。

+0

對不起,我的意思是,JSON.parse()。 – Miroslav

+0

由於你們中的大多數人會看到我需要某種方式確保一個請求在我開始下一個請求之前成功完成,因此我不會遇到許多同時發生的請求。 – Miroslav

+0

請求數據後,您希望阻止JavaScript提出更多數據請求,直到您的第一個結果爲成功完成或失敗。那是你的要求嗎? –

回答

1

在開始下一個請求之前,確保上一個請求的唯一方法是從上一個onreadystatechanged事件開始下一個調用。因爲ajax異步運行,所以不能保證你運行的其他代碼是否會在ajax調用完成之前或之後執行。

所以,你需要重新組織你的腳本一點:

var xmlhttp; 

window.onload = function(){  
    setupAjaxObject(); 
    getEventdataFromDB(); 
} 

function setupAjaxObject() 
{ 
    if(window.XMLHttpRequest){ 
     xmlhttp = new XMLHttpRequest(); 
    }else{ 
     xmlhttp = new ActiveXObject('Microsoft.XMLHTTP'); 
    } 


    xmlhttp.onreadystatechange = function(){ 
     if(xmlhttp.readyState == 4){ 
      if(xmlhttp.status == 200){ 

      var dbData = xmlhttp.responseText; 

      if(dbData != ''){ 
       processEvents(dbData); //function for data processing 
      } 
      } 
      getEventdataFromDB(); //run the next request 
     } 
    } 
} 

function getEventdataFromDB(){ 

    xmlhttp.open('GET','getEvents.php?dataRequest=true',true); 
    xmlhttp.send(); 

} 

如果你想請求之間的一個小的延遲,你可以調用換到超時內的下一個請求。