从 HttpRequest 将字符串解析为 json/XML答案

【问题标题】：Parsing string to json/XML from a HttpRequest从 HttpRequest 将字符串解析为 json/XML
【发布时间】：2017-03-24 13:47:57
【问题描述】：

我正在尝试解析来自 noSQL 数据库的字符串。有困难。当您访问 PHP 文件时，它会给出如下结果：

[{"timestamp":"2016-11-07T09:48:30.335Z","Id":"d7ee735f16b5"},
{"timestamp":"2016-11-07T09:48:29.015Z","Id":"d7ee735f16b5"},    
{"timestamp":"2016-11-07T09:48:27.688Z","Id":"d7ee735f16b5"},
{"timestamp":"2016-11-07T09:48:27.085Z","Id":"d7ee735f16b5"},
{"timestamp":"2016-11-07T09:48:26.577Z","Id":"d7ee735f16b5"}]

在控制台的网络中给出相同的结果。

当我尝试对响应进行字符串化时，它显示为 null。

请任何人帮助我访问时间戳值。这是当前代码：

var ajax = new XMLHttpRequest();
ajax.open("GET", url, true);
ajax.responseType = 'json';
ajax.send();
var jsonResponse = JSON.stringify(ajax.response);
document.getElementById('demo').innerHTML = jsonResponse;

【问题讨论】：

标签： php json xml xmlhttprequest nosql

【解决方案1】：

在此示例中，很可能尚未从服务器返回响应。还要验证 id 为“demo”的元素是否确实存在于您的 html 文档中。

向 ajax 对象添加事件监听器：

ajax.onload = loadCompleted;  
ajax.onerror = onLoadError;

然后创建一个函数来处理结果：

var jsonResponse = JSON.stringify(ajax.response);
document.getElementById('demo').innerHTML = jsonResponse;

完整示例（根据 Bozidar 的 cmets 更新）：

var url = 'https://jsonplaceholder.typicode.com/posts/1';

function loadCompleted() {
    console.log(ajax.response)
    var jsonResponse = JSON.stringify(ajax.response);
    document.getElementById('demo').innerHTML = jsonResponse;
}

function onLoadError() {
    //handle error logic
}

var ajax = new XMLHttpRequest();   
ajax.onload = loadCompleted;
ajax.onerror = onLoadError;
ajax.open("GET", url, true);
ajax.responseType = 'json';
ajax.send();

有关工作示例，请参阅 https://jsfiddle.net/px3mxa4n/。

【讨论】：

您将“readyState”变量作为 XMLHttpRequest 对象的一部分，因此不需要 eventListener...
谢谢@BozidarSikanjic。我更新了代码以使用 onload 和 onerror。这些更明确，表达意图更好一点。

【解决方案2】：

您不应该在继续编写代码之前等待响应吗？比如：

ajax.onreadystatechange = function () { 
   if(ajax.readyState == 4 && ajax.status == 200) { 
      // do what you need like
      var jsonResponse = JSON.stringify(ajax.response); // maybe JSON.parse and then iterate trough array of objects to create individual HTML elements?
      // .......
   }
}

【讨论】：