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

How to wait for an http call to get over in js?

本文关键字：http 调用 结束 等待 js      更新时间：2023-09-26

我正在使用$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;   
}

在这种情况下，我的代码会先打印"---在收到响应后---"，然后打印"---关于成功---"，但我打算始终先打印"----关于成功----"。

更新：已经更新了片段来进一步解释我的场景。

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

您的困惑可能源于AJAX调用是非阻塞的事实（如在异步中，如在A同步JavascriptAndXML中）。您可以在一行中触发多个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的请求，直到它返回

尝试使用always

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