getJSON完成回調

Question

我有每5秒調用一次的函數bellow以從服務器獲取數據，這是flask / python。 我的問題是，當成功檢索數據時，如何使getjson調用具有回調功能。

我知道有.done .fail等等，但我想知道是否可以保留此結構並僅添加以下內容，但我不了解這種特殊情況的語法，希望這不會造成混淆，謝謝閱讀，這是代碼。

// get data from the server every getDataFromServerInterval milliseconds
var getDataFromServerInterval = 5000;
function getData(){
  // request timesince table entries from server for user...
  $.getJSON($SCRIPT_ROOT + '/_database', {
    action: "getUserTable_timesince",
    username: $('input[name="username"]').val()
  }, function(data) { // do something with the response data
    timesince_dataBuffer = data;
  });
  return false; // prevent get
}
// get data from the server every getDataFromServerInterval milliseconds
setInterval(getData, getDataFromServerInterval);

Answer 1

你可以做這樣的事情。 不用處理getData的數據或使用回調，而要利用$.getJSON返回的承諾 。 有一個單獨的函數，該函數由超時調用，該超時調用數據， then處理。 它巧妙地將您的代碼分離為更易於管理的功能。

var getDataFromServerInterval = 5000;

function getData() {
  return $.getJSON($SCRIPT_ROOT + '/_database', {
    action: "getUserTable_timesince",
    username: $('input[name="username"]').val()
  }
}

function wrangleData() {
  getData().then(function (data) {
    console.log(data);
  });
}

setInterval(wrangleData, getDataFromServerInterval);

Answer 2

我找到了一個部分解決方案，我意識到我可以在函數的末尾添加一個回調來處理接收到的數據，這在不同的getjson調用結構中等效於.done，我不確定該函數是否在接收數據之前或之后調用。

// global timesince buffer, holds
var timesince_dataBuffer;

// get data from the server every getDataFromServerInterval milliseconds
var getDataFromServerInterval = 5000;
function getData(){
  // request timesince table entries from server for user
  $.getJSON($SCRIPT_ROOT + '/_database', {
    action: "getUserTable_timesince",
    username: $('input[name="username"]').val()
  }, function(data) { // do something with the response data
    timesince_dataBuffer = data;
    updateEntryStruct(); // the hope is to call this when data is received
  });
  return false; // prevent get
}
// get data from the server every getDataFromServerInterval milliseconds
setInterval(getData, getDataFromServerInterval);

Answer 3

這是我想出的解決方案。

var timesince_dataBuffer;
function getData(){
  // gets user's entries from sql table
  $.getJSON($SCRIPT_ROOT + '/_database', { // $SCRIPT_ROOT, root to the application
    action: "getUserTable_timesince",
    username: $('input[name="username"]').val()
  }, function(data) { // if a response is sent, this function is called
    timesince_dataBuffer = data;
    updateEntryStruct(); // recreate the structure of each content, buttons etc
  });
  return false;
}

我得到數據，將其放在全局變量中，調用另一個函數，該函數接收該數據並為接收到的每個對象重新創建一個結構，這樣，我就不會重新創建靜態的結構部分，最重要的是按鈕。

每1秒調用另一個功能，該功能會更新動態部件。 自（事件名稱）以來經過的（格式化時間）

無論如何，這實際上是我在CS50中完成的最后一個項目，我首先通過表單提交與服務器進行通信，每次用戶按下按鈕時刷新頁面，然后通過ajax完成，但是我每2次向服務器發送一次請求秒，並具有無響應的按鈕，因為我會在一段時間間隔內自行重新創建按鈕。 現在，頁面讓您感到響應迅速且高效，這已經是一個很棒的學習體驗。

如果有人想簽出代碼，一切都在這里。 https://github.com/silvermirai/cs50-final-project

我想到的基本上是一堆隨機功能。 到目前為止，可以在這里找到該應用程序。 http://ide502-silvermirai.cs50.io:8080/