从 XHTTP 请求传递数据库内容

如何解决从 XHTTP 请求传递数据库内容

我有一个 xhttp GET 请求，可以使用其 api 网关 url 获取我的数据库中的项目。该请求工作正常，因为我可以从浏览器的开发控制台看到我的数据库内容，这些内容在字符串（键：值对）中。我画一个空白的地方是如何将 db 的内容传递给另一个将其解析为 javascript 对象的函数。

获取请求代码

function fetch(){
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      console.log(this.responseText);
    }
  };
  xhttp.open("GET","<mygatewayapi_url>",true);
  xhttp.send();
}

将数据库内容解析为javascript对象的代码

function displayObj(dataStr){
    var obj = JSON.parse(dataStr);
    var html = "";
    var item =;
    //var keys = Object.keys(obj);
    //var last = keys[item.length - 1];

    for (item in obj){
        html += '<li>' + item + ' ' + obj[item] + </li>';
        /*if (last === true)
            html += '<li>' + item + ' ' + obj[item] + </li>' + "<br>";*/
    }
    return '<li>'+html+'</li>';

解决方法

您可以在 xhttp.onreadystatechange 回调中处理结果：

function fetch(){
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      var result = displayObj(this.responseText);
      console.log("result: \n",result); 
    document.getElementById("demo").innerHTML = result;
    }
  };
  xhttp.open("GET","https://api.github.com/emojis",true);
  xhttp.send();
}

function displayObj(dataStr){
    var obj = JSON.parse(dataStr);
    var html = "";

    for (var item in obj){
        html += '<li>' + item + ' ' + obj[item] + '</li>';
    }
    return '<ul>'+html+'</ul>';
}

fetch();

<div id="demo"></div>