javascript - 未将数组从 Node.js 获取到 AJAX

标签 javascript html ajax node.js

嗨,根据我的代码,我似乎没有到达或响应从 Node.js 到 AJAX 的数组,没有其他错误或什么,但我似乎无法弄清楚我的代码出了什么问题,请参见下文。预先感谢您的帮助!

AJAX code below:

function update() {
let rq = new XMLHttpRequest();
    rq.onreadystatechange = function() {
        if(rq.readyState == 4) {
        var arr = JSON.parse(rq.responseText);
        for(var i = 0; i < arr.length; i++) {
        document.getElementById("message").innerHTML += "<p>" + arr[i] + "</p>";
        }
    }
    rq.open("GET", "/messages", true);
    rq.send();
  }
}

Node.js code to handle GET:

if(req.method == "GET") {
  req.on('data', function(data) {
    console.log("You are reching GET-DATA");
  });
  req.on('end', function() {
    console.log("You are reching GET-END");
    res.writeHead(200, { "Content-Type" : "application/json" })
    console.log(JSON.stringify(arr))
    var toString = JSON.stringify(arr);
    res.end(JSON.stringify(arr));
  });
}

enter image description here

我正在到达console.log(req.readystate),它输出“1”alert(“您的程序达到了rq.onreadystatechange”);alert(“您的程序达到了rq.onreadystatechange = 4”);,然后过了一会儿,现在将收到响应,我在控制台上看到错误。

enter image description here

最佳答案

ajax 代码在 onreadystatechange 回调中包含 opensend。您需要将其移出那里:

function update() {
    console.log('update called');
    let rq = new XMLHttpRequest();
    rq.onreadystatechange = function() {
        console.log('readyState: ' + rq.readyState);
        if(rq.readyState == 4) {
            console.log('responseText: ' + rq.responseText);
            var arr = JSON.parse(rq.responseText);
            for(var i = 0; i < arr.length; i++) {
                document.getElementById("message").innerHTML += "<p>" + arr[i] + "</p>";
            }
        }
    };
    // moved out of above function
    rq.open("GET", "/messages", true);
    rq.send();
}

通过添加一些 console.log 调用,您还可以更好地跟踪正在发生(未发生)的情况。

关于javascript - 未将数组从 Node.js 获取到 AJAX,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40822132/

相关文章:

javascript - Angular JS : why {{objA. objB.date | date :'dd.MM.yyyy HH:mm' }} 需要多少时间?

javascript - 如何以 Angular 8 修改 Canvas 上 fabric.js 背景图像的图像选项

javascript - 使用 Jquery (ajax) 调用子域脚本时,我没有看到 SESSION 变量

javascript - 如何在所有类型的浏览器中禁用 HTML 5 Video Player 全屏按钮,尤其是在 IE、Edge 和 Firefox、Opera、Safari 中?

javascript - 如何在 Highcharts 散点图中显示类别名称而不是 point.y?

html - 如何为某些绝对位置 div 设置背景颜色?

javascript - 检查子元素宽度是否超​​过父元素宽度

javascript - 文本框刷新的动态文本

php - 如何创建 Hi5 的分享按钮

javascript - 当网址不为空时歌曲无法播放