依次调用API,直到响应为空

时间:2019-03-21 13:45:13

标签: javascript xmlhttprequest

我正在尝试连续调用API并浏览页面直到响应为空。每页最多返回1000个“结果”,直到最终仅返回[]

我尝试了下面的代码,但是while循环无限期地继续,并且即使我知道第5页返回空值,该标志也永远不会设置为false。

 var count = 1;
 var flag = true;
 var request = new XMLHttpRequest();

 while (flag == true) {
    request.open('GET', 'https://api.example.net/results/?page=' + count, true);
    count++;
    request.onload = function () {
      var data = JSON.parse(this.response);
      if (data.length == 0) {
        flag = false;
      }
    }
    request.send();
 }

1 个答案:

答案 0 :(得分:1)

问题来自代码是异步的事实。特别是,onload回调仅在进行调用后的某个时间收到响应时才触发。您的脚本不会停止运行以“等待”响应,因此它将继续在循环中进行耕作,因为flag仍然是true。到出现“空”响应并且flag变为假时,循环可能已经运行了数千次,从而建立了“无用的” Ajax请求。

@AmitJoki已经建议了解决方法。这是一种方法(使用@PranavCBalan建议的递归-尽管当我看到他的评论时我已经开始写这篇文章了:-)):

function sendRequest(count) {
    var request = new XMLHttpRequest();
    request.open('GET', 'https://api.example.net/results/?page=' + count, true);
    request.onload = function () {
      var data = JSON.parse(this.response);
      if (data.length > 0) {
        sendRequest(count+1);
      }
    }
    request.send();
}

sendRequest(1);

主要区别在于,在发送一个请求之后,此代码将不会发送另一个请求,直到返回响应并确认data.length大于0。