javascript - JQuery AJAX 无法解析 PHP PDO 方法的响应

Question

我正在尝试使用 JQuery AJAX 和 PHP 填充下拉列表。我在 PHP 中创建了一个方法，它 echo 是一个 json_encoded() array。但是，当加载文档时，由于一些 JSON 解析错误，它无法获取结果。

我在 PHP 中使用了一个可调用的存储过程，并在 MySQL Workbench 中测试该存储过程时验证了它返回了正确的结果集。

这可能是什么原因造成的？

错误:

Parsing JSON Request Failed

RoleDaoImpl.php

function getAllRoles()
{
    $roleList[] = "";
    try {
        $SQL = "CALL getAllRoles()";
        $sp_getAllRoles = $this->connection->prepare($SQL);
        $sp_getAllRoles->execute();

        $resultSet = $sp_getAllRoles->fetchAll(PDO::FETCH_ASSOC);
        foreach ($resultSet as $row) {
            $roleId = $row['role_id'];
            $roleName = $row['role_name'];

            $roleList[] = array("roleId" => $roleId, "roleName" => $roleName);
        }
        echo json_encode($roleList);
    } catch (PDOException $e) {
        die($e->getMessage());
    }
}

get_all_roles.php

require_once '../../core/init.php';
$roleDaoImpl = new RoleDaoImpl($pdo);

$roleDaoImpl->getAllRoles();

JS文件

$(document).ready(function(){
    loadRolesToDropDown();
});

function loadRolesToDropDown(){
    var url = 'get_all_roles.php';
    $.ajax({
        url: url,
        type: 'post',
        dataType: 'json',
        success: function(response){
            var len = response.length;
            alert(response);
            $("#roledropdown").empty();
            for(var i = 0; i < len; i++){
                var roleId = response[i]['roleId'];
                var roleName = response[i]['roleName'];
                $("#roledropdown").append("<option value='"+roleId+"'>"+roleName+"</option>");
            }
        },
        error : function(x,e){
            if (x.status==0) {
                alert('You are offline!!\n Please Check Your Network.');
            } else if(x.status==404) {
                alert('Requested URL not found.');
            } else if(x.status==500) {
                alert('Internal Server Error.');
            } else if(e=='parsererror') {
                alert('Error.\nParsing JSON Request failed.');
            } else if(e=='timeout'){
                alert('Request Time out.');
            } else {
                alert('Unknown Error.\n'+x.responseText);
            }
        }
    });
}

我想不出其他方法来确定原因。我对将 AJAX 与 PHP 结合使用还很陌生。我使用 AJAX 来避免刷新页面。最近，我尝试遵循一些教程，并仍在尝试掌握 JQuery Ajax 和 PHP 如何协同工作。

我还可以进行哪些其他故障排除？

如果有任何建议，我将不胜感激。

谢谢。

***** 编辑 *****

我尝试使用 console.log() 打印日志，如下所示:

success: function(response){
    var len = response.length;
    alert(response);
    console.log(response);
    $("#roledropdown").empty();
    for(var i = 0; i < len; i++){
        var roleId = response[i]['roleId'];
        var roleName = response[i]['roleName'];
        $("#roledropdown").append("<option value='"+roleId+"'>"+roleName+"</option>");
    }
}

我在 Google Chrome 的控制台窗口上看到了 ff。

jquery-3.3.1.js:9488 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.

然后，我检查了这一行ajax @jquery-3.3.1.js:9206。我得到了 ff。 (我不知道这是否与解析有关)

try {
    completed = false;
    transport.send( requestHeaders, done );
    } catch ( e ) {
    // Rethrow post-completion exceptions
    if ( completed ) {
        throw e;
    }

    // Propagate others as results
    done( -1, e );
}

顺便说一句，下拉列表包含在模态 div 中。我不确定它是否与该错误有任何关系。根据控制台窗口中显示的消息，某些内容似乎已被弃用。

***** 编辑结束 *****

Answer 1

如果您怀疑 json_encode() 有问题，则必须检查该函数是否返回 false，然后使用 json_last_error() 了解原因。