javascript - 在显示接收到的数据之前等待 Node 中的函数完成

Question

这个问题已经有答案了:

Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference (7 个回答)

已关闭 4 年前。

我正在尝试从 Node.js 中的 API 调用发回结果数据。我有一个 HTML 表单，其中设置了一个搜索栏，该搜索栏接受搜索词并使用该词启动搜索。

现在，数据被发送回，并且在第一次单击时为空，但是当我再次单击时，上一次调用的数据被发送回我的 HTML 页面，所以我知道回调方面发生了一些事情。我可以在 res.json() 上使用 setTimeout，但这似乎有点……幼稚。

我对 Node 还很陌生，我知道解决方案相当简单......但我似乎不太明白。

promise 、回调、异步。也许我只是对他们去了哪里有点困惑......

var result;
var Questrade = require("questrade");
var qt = new Questrade("env.KEY")
qt.account = "env.ACCOUNT";

qt.on("ready", function(err) {
  if (err) {
    console.log(err);
  }
});

function searchQt() {
  qt.search(searchTerm, function(err, symbols) {
    if (err) {
      console.log(err);
    }

    result = symbols;
  });
}

app.get("/search", function(req, res) {
  searchTerm = req.query.symbol;

  searchQt();

  res.json(result);
});

我希望能按时收到我的数据。

Answer 1

最简单且增量最多的解决方案是将 res.json(result) 移动到接收 result 值的回调。

function searchQt(res) {  // <-- note added argument
  qt.search(searchTerm, function(err, symbols) {
    if (err) {
      console.log(err);
    }
    result = symbols;
    res.json(result);   // here it is!
  });
}

app.get("/search", function(req, res) {
  searchTerm = req.query.symbol;

  searchQt(res); <-- note added argument

  // res.json(result);  <-- commented out and moved above
});

您还可以使用 Promise 或 async/await 来工作，但由于您已经在使用回调，因此这是获得工作代码的最增量方式。

当您在其中时，您应该从外部范围中删除result。您不需要或不希望在请求之间保留该值。因此，只需 res.json(symbols); 并完全删除 results 变量。

像上面那样将 res 作为参数传递有点代码味道。让我们将对 qt.search() 的调用直接移至 app.get() 的回调中，以稍微清理一下内容。这完全消除了 searchQt() 函数:

app.get("/search", function(req, res) {
  searchTerm = req.query.symbol;

  qt.search(searchTerm, function(err, symbols) {
    if (err) {
      // handle error here somehow. maybe something like this?
      console.log(`An error occurred: ${err}`);
      res.status(500).end('An error occurred');
      return;
    }
    res.json(symbols);
  });
});

这里还有一些其他可能的改进。 (例如，我不确定在尝试搜索之前是否需要触发 ready 事件。因此那里可能存在竞争条件。) Promises 或 async/await 可能会使此内容更具可读性。 (人们似乎比深度嵌套的回调更喜欢这些。我个人不介意嵌套，但我明白。)但这希望能让你朝着正确的方向前进。 (希望我没有添加任何以前不存在的错误!)