Javascript 新手陷入 XMLHttpRequest 返回数据困境

Question

自从我上次使用 JavaScript 以来可能已经有十多年了，所以现在就开始吧。我正在尝试显示来自后端数据库和/或 ESP32 微 Controller 的图表。很容易从示例生成静态 HTML/CSS/JavaScript 图表，但我需要图表每秒更新实时数据。我可以让 JavaScript 通过 XMLHttpRequest 调用数据库并返回数据，但我不知道如何将其返回到更新图表的变量中。

我在 https://www.amcharts.com/ 上或多或少找到了项目所需的图表。 .

// using chart.setTimeout method as the timeout will be disposed together with a chart
 chart.setTimeout(randomValue, 1000);

function randomValue() {
    //hand.showValue(Math.random() * 1000, 1000, am4core.ease.cubicOut); // <----- sample code supplied
    //hand.showValue(550); // <---- my test code which works

    // after some googling I found this...
    function reqListener () {
        console.log(this.responseText);
    //alert(oReq.responseText); // <---- when un-commented I can see my data that the database is returning every second, just an integer value and nothing else.
    }

    var oReq = new XMLHttpRequest();
    oReq.addEventListener("load", reqListener);
    oReq.open("GET", 'http://myurl.com');
    oReq.send();

    hand.showValue(oReq.responseText); <<<<<< what do I put in the () to show the same data that the alert above displays correctly?

    chart.setTimeout(randomValue, 1000); // < original supplied sample code
}

什么也没发生...我也不知道:)

Answer 1

XMLHttpRequest 要求您添加事件监听器并等待 load 事件。一旦请求完成，这将告诉您，然后您可以对响应执行某些操作。

查看此网站以获取更详细的说明: https://javascript.info/xmlhttprequest