如何在 js 中等待 http 调用结束？答案

【问题标题】：How to wait for an http call to get over in js?如何在 js 中等待 http 调用结束？
【发布时间】：2014-11-27 21:41:37
【问题描述】：

我正在使用 $http 对用户进行 http 调用。我有一个成功方法，它在从服务器获取成功响应时被调用。我的问题是我如何才能等待（即在调用完成后才执行所写的操作）让 http 调用结束？

main(){ 
    var val = myFunction();
    console.log("---after receiving response---");
    return val;
}
myFunction(){
    var temp;
    fnResource.get(function(data){
        {
            console.log("---on success---");
            temp = data;
        });     
    return temp;   
}

在这种情况下，我的代码首先打印“---收到响应后---”，然后是“---成功---”，但我打算有“---成功---”总是先打印。

更新：更新了 sn-p 以进一步解释我的场景。

【问题讨论】：

success 回调实际上是告诉您呼叫结束...将您的代码放入其中...
为什么你不做你必须在success回调内部做的事情？

标签： javascript angularjs

【解决方案1】：

尝试使用always

myFunction(){
    $http.get("..api/endpoint/").
        success(function(data){
            console.log("---on success---");
        })
        .always(function() {
          console.log("---after receiving response---");
        });
}

【讨论】：

【解决方案2】：

您的困惑可能源于 AJAX 调用是 非阻塞（如异步，如 A 同步 J avascript A 和 X ML）。您可以连续触发多个 AJAX 请求，并且在检索到它们之前，其中一个不会阻止其他请求的发送。考虑一下：

$http.get('/route1').success(function() { console.log('route 1 success'); });
$http.get('/route2').success(function() { console.log('route 2 success'); });
$http.get('/route3').success(function() { console.log('route 3 success'); });

对/route2 和/route3 的AJAX 调用不必等待第一个AJAX 调用完成就可以发送。此外，在这种情况下，您无法保证出于多种不同原因，他们将以何种顺序返回，这完全超出了本问题的范围。关键是，多次运行上述代码可能会导致日志如下所示：

route 1 success
route 2 success
route 3 success

但它同样可能看起来像这样：

route 2 success
route 1 success
route 3 success

而且你无法控制它。但是，您可以执行以下操作来强制 HTTP 请求以特定顺序返回：

$http.get('/route1').success(function() { 
    $http.get('/route2').success(function() { 
        $http.get('/route3').success(function() { 
            console.log('all requests complete');
        });
    });
});

对route1 的AJAX 请求将阻止对route2 的请求，直到它返回

【讨论】：

【解决方案3】：

只需将代码放在$http.get(...) 之后的单独函数中，然后从success 回调中调用它。

【讨论】：