javascript - 如何从 api 自动更新数据?
问题描述
我从 API 获取数据,但没有自动更新。我能做些什么?如何自动更新?
<div>
<p id="pet">Lorem, ipsum dolor.</p>
</div>
var burl = "https://api.binance.com"
var query = "/api/v3/depth"
query += "?symbol=BTCUSDT&limit=5" //price
var url = burl + query;
var myrequest = new XMLHttpRequest();
myrequest.open("GET", url, true);
myrequest.onload = (function() {
if (this.status == 200) {
var dizi = new Array();
dizi = JSON.parse(myrequest.responseText)
var price = Number(dizi.asks[0][0]);
console.log(typeof price)
$("#pet").text(price)
}
})
myrequest.send();
解决方案
您可以使用 setTimeout() 函数定期调用 API,例如每 5 秒一次。首先,您必须将代码移动到函数中,然后调用该函数。
Lorem, ipsum dolor。function getData(){
var burl = "https://api.binance.com"
var query = "/api/v3/depth"
query += "?symbol=BTCUSDT&limit=5" //price
var url = burl + query;
var myrequest = new XMLHttpRequest();
myrequest.open("GET", url, true);
myrequest.onload = (function() {
if (this.status == 200) {
var dizi = new Array();
dizi = JSON.parse(myrequest.responseText);
var price = Number(dizi.asks[0][0]);
console.log(typeof price);
$("#pet").text(price);
setTimeout(getData(), 5000); //5000 means 5 seconds
}
});
myrequest.send();
}
getData();
请注意,我没有使用 setInterval() 一遍又一遍地调用该函数。我在成功中使用 settimeout() 以确保仅在当前调用完成时才调用下一个调用。
推荐阅读
- jetbrains-ide - actionlist 中的哪一项操作是 IDE 键盘映射:“显示上下文操作”
- python - 数据校准
- c++ - 在应用程序运行时,使嵌入可执行文件的二进制 blob 作为文件系统文件可访问。C/C++
- django - 是否可以在视图中在 Django 对象上添加新数据?
- c# - 使用 ASP.NET Core MVC 从数据库中提取数据并保存为 Excel 文件
- firebase - Flutter web Firebase 身份验证 URL 重定向
- c# - xml 更改后,与 DynamicResource XmlDataProvider 的网格绑定未更新
- java - ECB 模式:我可以在实体中使用打印方法吗?
- swift - 如何使用辅助功能 API 控制应用程序
- java - 如何指定一个 MaskFormatter?