XMLHttpRequest起始和结束之间的循环JavaScript

Question

我正在使用XMLHttpRequest执行一个AJAX请求，使用普通的旧Javascript（不是jQuery）可能会花费一些时间。该请求调用处理某些事务的端点。

我可以通过另一个端点检查事务的状态，但是我希望在异步AJAX请求发生时在屏幕上“刷新”此信息。此“进度”事务也将是GET AJAX请求。

我一直在查看XmlHttpRequest对象，并尝试使用onprogress，但这并没有真正实现我所期望的，这有点像while循环。

用伪代码，这是

    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'process/', true);
    xhr.send();

    // while request is pending, call another process repeatedly

    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                console.log("Request Successful");
            } else {
                console.log("Request Failed");
            }
        } else {
            console.log("Request State changed but not complete");
        }
    }

我似乎无法破解。我假设根据适当范围内的值进行while循环可能会解决问题，但似乎异步方面从未更新此值来打破循环。

我以为进度条等可能很常见，但是我找不到任何可行的方法？我是否缺少明显的东西？

Answer 1

以典型的方式，我在发布后不久就发现了这一点。

我将函数设置为每秒调用一次，然后在请求完成后删除间隔：

    let intervalId;
    xhr.onloadstart = function (e) {
        intervalId = setInterval(function () {
            myProgressFunction();
        }, 1000)
    };
    xhr.open('GET', '/process', true);
    xhr.send();
    xhr.onloadend = function (e) {
        clearInterval(intervalId);
    };