針對JSON響應的jQuery AJAX輪詢，基於AJAX結果或JSON內容的處理

我是一位新手到中級JavaScript/jQuery程序員，因此非常感謝具體/可執行示例。針對JSON響應的jQuery AJAX輪詢，基於AJAX結果或JSON內容的處理

我的項目需要使用AJAX來輪詢返回包含任一內容被添加到DOM JSON一個URL，或消息{「狀態」：「未決」}指示後端可以仍然工作產生內容的JSON響應。這個想法是，對URL的第一個請求觸發後端開始構建一個JSON響應（然後被緩存），隨後的調用檢查這個JSON是否準備就緒（在這種情況下提供）。

在我的劇本，我需要輪詢以15秒間隔此URL高達1:30分鐘，並執行以下操作：

如果在錯誤的Ajax請求的結果，終止腳本。
如果AJAX請求成功，並且JSON內容包含{「status」：「pending」}，請繼續輪詢。
如果AJAX請求取得成功，並且JSON內容包含可用內容（即除{「status」：「pending」}以外的任何有效響應），則顯示該內容，停止輪詢並終止腳本。

我已經嘗試了一些有限的成功方法，但我感覺他們都比他們需要的更混亂。下面是我成功用於製造在一次一個AJAX請求，如果我從JSON響應可用含量，它的工作骨骼功能：

// make the AJAX request 
function ajax_request() { 
    $.ajax({ 
    url: JSON_URL, // JSON_URL is a global variable 
    dataType: 'json', 
    error: function(xhr_data) { 
     // terminate the script 
    }, 
    success: function(xhr_data) { 
     if (xhr_data.status == 'pending') { 
     // continue polling 
     } else { 
     success(xhr_data); 
     } 
    }, 
    contentType: 'application/json' 
    }); 
}

但是，此功能目前什麼也不做，除非它接收包含可用內容的有效JSON響應。

我不確定如何處理只是評論的行。我懷疑另一個函數應該處理輪詢，並根據需要調用ajax _ request（），但我不知道用於請求（）的最優雅方式是將其結果返回給輪詢函數，以便它可以響應適當。

任何幫助非常感謝！請讓我知道我是否可以提供更多信息。謝謝！

來源

2009-09-10 Bungle

您可以使用簡單的超時遞歸調用ajax_request。

success: function(xhr_data) { 
    console.log(xhr_data); 
    if (xhr_data.status == 'pending') { 
    setTimeout(function() { ajax_request(); }, 15000); // wait 15 seconds than call ajax request again 
    } else { 
    success(xhr_data); 
    } 
}

堅持一個計數器檢查這條線，你有最大數量的民意調查。

if (xhr_data.status == 'pending') { 
    if (cnt < 6) { 
    cnt++; 
    setTimeout(function() { ajax_request(); }, 15000); // wait 15 seconds than call ajax request again 
    } 
}

除非你想提醒或什麼，否則你不需要在你的錯誤函數中做任何事情。簡單的事實是它的錯誤會阻止成功函數被調用並可能觸發另一輪投票。

來源

2009-09-10 17:25:38 Joel

謝謝，喬爾！這對我有用 - 我很感激。 – Bungle 2009-09-11 19:20:11

setTimeout（）在延遲期間阻塞腳本的其餘部分的執行嗎？ – 2011-09-19 11:38:45

編號'setTimeout（）'指定將來執行一段代碼的時間間隔。只有當超時到期並且代碼運行時，腳本的其餘部分纔會被阻止。 – Joel 2011-09-19 17:25:30

關閉我的頭頂：

$(function() 
{ 
    // reference cache to speed up the process of querying for the status element 
    var statusElement = $("#status"); 

    // this function will run each 1000 ms until stopped with clearInterval() 
    var i = setInterval(function() 
    { 
     $.ajax(
     { 
      success: function (json) 
      { 
       // progress from 1-100 
       statusElement.text(json.progress + "%"); 

       // when the worker process is done (reached 100%), stop execution 
       if (json.progress == 100) i.clearInterval(); 
      }, 

      error: function() 
      { 
       // on error, stop execution 
       i.clearInterval(); 
      } 
     }); 
    }, 1000); 
});

來源

2009-09-10 17:25:55 roosteronacid

感謝您的回覆！我發現Joel Potter的解決方案在我的情況下效果更好 - 但這很有用。 – Bungle 2009-09-11 19:19:39

非常感謝你的功能。這是一個小錯誤，但這裏是修復。 roosteronacid的答案在達到100％後不會停止，因爲clearInterval函數的使用有誤。

這裏是一個工作的功能：

$(function() 
{ 
    var statusElement = $("#status"); 

    // this function will run each 1000 ms until stopped with clearInterval() 
    var i = setInterval(function() 
    { 
     $.ajax(
     { 
      success: function (json) 
      { 
       // progress from 1-100 
       statusElement.text(json.progress + "%"); 

       // when the worker process is done (reached 100%), stop execution 
       if (json.progress == 100) clearInterval(i); 
      }, 

      error: function() 
      { 
       // on error, stop execution 
       clearInterval(i); 
      } 
     }); 
    }, 1000); 
});

調用clearInterval（）函數becomming區間id作爲參數，然後一切都很好;-)

乾杯聶

來源

2010-08-18 09:11:45 Nik

你可以使用javascript setInterval函數每5秒加載一次內容。

var auto= $('#content'), refreshed_content; 
    refreshed_content = setInterval(function(){ 
    auto.fadeOut('slow').load("result.php).fadeIn("slow");}, 
    3000);

爲了您參考 -

Auto refresh div content every 3 sec

來源

2014-08-30 22:27:19 appsntech

針對JSON響應的jQuery AJAX輪詢，基於AJAX結果或JSON內容的處理

回答

相關問題