Question

我有一个必须执行以下任务的Web应用程序。对于选定的日期范围，它会为该范围内的每个日期向Web服务发出GET请求;这可能需要一段时间，因为我想稍后可视化数据，所有调用都是同步的（每个请求的结果都存储在一个数组中）。这种检索需要一段时间（几秒钟），这意味着主线程“冻结”。

什么是避免这种情况的好方法？（例如，在单独的线程中进行检索，并在完成后得到通知。）

Answer 1

考虑使用promises。它们使您可以执行对API的非阻塞调用。它基本上就是你所要求的。

编辑：当所有操作完成后，您可以专门使用when()进行通知。

Answer 2

您应该使您的GET请求异步，然后在所有请求完成后进行可视化。

var get1 = $get(..
var get2 = $get(..
var get3 = $get(..

$.when(get1, get2, get3).done(function (...) {
  // do something with the response
  visualize();
});

Answer 3

实际上有一个简单的解决方案。让我们实现一个function，当所有响应到达时需要执行它：

function onFinished(responses) {
    //Do something
}

现在，假设您有一个function，它将日期作为数组返回：

function getDates(range) {
    //Do something
}

另外，我们需要getURL，如下所示：

function getURL(date) {
    //Do something
}

最后，假设您有一个名为dateRange的变量，其范围将用作getDates中的输入。所以我们可以这样做：

var requestDates = getDates(dateRange);
var requestsPending = requestDates.length;
var responses = [];
for (var requestIndex in requestDates) {
    $.ajax({
        url: getURL(requestDates[requestIndex]),
        method: "GET",
        //You might pass data as well here if needed in the form of
        //data: yourobject,
    }).done(function(data, textStatus, jqXHR) {
        //Handle response, parse it and store the result using responses.push()
    }).fail(function(jqXHR, textStatus, errorThrown) {
        //Handle failed requests
    }).always(function(param1, param2, param3) {
        if (--requestsPending === 0) {
            onFinished(responses);
        }
    });
}

这将为您需要的每个日期发送AJAX请求并异步等待其响应，因此，您实际上不会等待待处理时间的总和，而是等待最长的待处理时间，这是一个很好的优化。以多线程方式解决这个问题是不可能的，因为Javascript是单线程的，因此您需要异步等待答案，因为请求不会在服务器上等待彼此。如果您也拥有服务器，那么您不需要为每个日期发送请求，而是要实现服务器端API函数，您将处理日期范围，因此客户端将发送单个请求并等待答案。

jQuery：在单独的线程中检索数据

3 个答案: