我正在使用XMLHttpRequest执行一个AJAX请求,使用普通的旧Javascript(而不是jQuery)可能会花费一些时间。该请求将调用处理某些事务的端点。
我可以通过另一个端点检查事务的状态,但是我希望在异步AJAX请求发生时在屏幕上“刷新”此信息。此“进度”交易也将是GET AJAX请求。
我一直在查看XmlHttpRequest对象,并尝试使用onprogress
,但这实际上并没有实现我期望的功能,这有点像while
循环。 / p>
在伪代码中,这将是
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循环可能会成功,但似乎异步方面从未更新此值来破坏循环。
我认为这对于进度条等来说可能很常见,但是我找不到任何可行的方法?我缺少明显的东西吗?
答案 0 :(得分:0)
通常,我在发布后不久就发现了这一点。
我将函数设置为每秒调用一次,然后在请求完成后删除间隔:
let intervalId;
xhr.onloadstart = function (e) {
intervalId = setInterval(function () {
myProgressFunction();
}, 1000)
};
xhr.open('GET', '/process', true);
xhr.send();
xhr.onloadend = function (e) {
clearInterval(intervalId);
};