javascript - 从 JavaScript 调用 PHP JSON 数据结果

Question

我正在尝试从我的 Javascript 代码获取 PHP 数据。这应该显示在 dayta div id 中。我最终得到的是 undefined 而不是所需的结果(在本例中是我的 JSON 文件中的 firstname)。我不知道为什么会发生这种情况。

我的JavaScript代码:

window.onload = function(){
    var http = new XMLHttpRequest();
    http.onreadystatechange = function(){
        if (http.readyState == 4 && http.status == 200){
            var dayta = document.getElementById('datadisplay');
                dayta.innerHTML = http.response.firstname;
        }
    }
    http.open("GET", "myphpfile.php", true);
    http.send();
}

我的PHP代码(myphpfile.php):

<?php   
    $content = file_get_contents('somejsonfile.json');
    print_r($content);
    $dbcon->close();
?>

包含的 PHP 代码只是我的代码的一部分，但它包含与我的问题相关的所有部分。

$content 输出一个 JSON 文件，因为这就是它所指向的内容。如果我 echo $content 我能够验证内容是否按预期流出。

因此，问题很可能出在我的 JavaScript 代码上。但我无法具体确定出了什么问题。

我的 JSON 文件 (somejsonfile.json):

{"firstname": "Ki ki ki ma ma ma"}

据我了解，处理此特定示例的最明显方法是简单地让 JavaScript 文件到达 JSON 文件。但是，由于我试图在生产代码中保护 JSON 文件的路径，所以我正在尝试此方法。

Answer 1

确保使用 JSON.parse 获得 JSON 响应。这是一个快速解决方案。我已经尝试过了，效果非常好!

window.onload = function(){
    var http = new XMLHttpRequest();
    http.onreadystatechange = function(){
        if (http.readyState == 4 && http.status == 200){
            var dayta = document.getElementById('datadisplay');
            var data = JSON.parse(http.responseText);
            dayta.innerHTML = data.firstname;
        }
    }
    http.open("GET", "myphpfile.php", true);
    http.send();
}