getJSON 完成回调答案

【问题标题】：getJSON done callbackgetJSON 完成回调
【发布时间】：2018-05-16 18:34:40
【问题描述】：

我每隔 5 秒调用一次函数来从服务器（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);

【问题讨论】：

你想对 getData 中的回调做什么？
“保持这个结构并在下面添加”：我不清楚。你的意思是？你可以编辑你的问题来举个例子吗？

标签： javascript jquery callback getjson

【解决方案1】：

我找到了一个部分解决方案，我意识到我可以在处理接收到的数据的函数末尾添加一个回调，这在某种程度上相当于 .done 在不同的 getjson 调用结构中，我不确定是否该函数在接收到数据之前或之后被调用。

// 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);

【讨论】：

【解决方案2】：

你可以做这样的事情。不要处理getData 中的数据或使用回调，而是利用$.getJSON 返回的promise。有一个单独的函数，由调用数据的超时调用，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);

【讨论】：

【解决方案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/

【讨论】：