Question

我曾经能够在NodeJS中完美地制作jQuery AJAX请求，但是当我尝试在PHP中做同样的事情时，我有几个问题。我在SO中找不到任何东西可以提供帮助，所以我想问一下，我的简单例子有什么问题？

index.php - 真的不多，只加载2个JS，1个PHP并定义一个按钮和一个段落。

<html>
    <head>
        <script src='jquery-3.0.0.js'></script>
        <script src='main_js.js'></script>      
    </head>
    <body>
        <button id="action" onClick="Send()">Send data</button>
        <p id="result">Lorem ipsum</p>

        <?php require('main_php.php'); ?>                   
    </body>
</html>

main_js.js - 它包含与'onClick'事件相关联的函数。

function Send(){
    var data_JSON = {
        input: "test",
        message: "Sending..."
    };          
    $.ajax({
        url: 'main_php.php',
        type: 'POST',
        data: data_JSON,
        contentType: 'application/json',
        success: function(data){                
            alert(data);                
            document.getElementById("result").innerHTML = "DONE!";          
        }       
    }); 

}

main_php.php - 从理论上讲，它会监听POST请求，然后发送回echo的JSON。再次，理论上......

<?php
if ($_POST){        
    // Make a array with the values
    $vals = array(
        'input'     => $input,
        'message'   => $message
    );      
    echo json_encode($vals, JSON_PRETTY_PRINT);     // Now we want to JSON encode these values to send them to $.ajax success.
    exit;                                           // to make sure you aren't getting nothing else
}
?>

jQuery AJAX的success函数运行，文本“DONE！”出现在段落中，但alert消息完全为空。 alert(data.input)（和message相同）显示undefined。

很明显，没有数据被发送回AJAX请求。我该如何解决？

注意：它是整个代码，没有其他显示，我也尽可能地缩短和简化。

Answer 1

那是因为你没有从PHP发送响应作为JSON。

在echo json_encode();

上方添加以下行

header('Content-Type: application/json');

所以你的PHP代码看起来像这样，

<?php
if ($_POST){        
    // Make a array with the values
    $vals = array(
        'input'     => $input,
        'message'   => $message
    );
    header('Content-Type: application/json');      
    echo json_encode($vals, JSON_PRETTY_PRINT);     // Now we want to JSON encode these values to send them to $.ajax success.
    exit;                                           // to make sure you aren't getting nothing else
}
?>

同样@Ismail提到dataType : 'json'在.AJAX调用中添加此内容以接受来自API的JSON响应。

Answer 2

<_>在main_js.js

中

function Send(){
    var data_JSON = {
        input: "test",
        message: "Sending..."
    };          
    $.ajax({
        url: 'main_php.php',
        type: 'POST',
        data: data_JSON,
        dataType: 'json',
        success: function(response){                
            if(response.type == "success")               
            {
                 alert(JSON.stringify(response.data));
                 alert(response.data.input);
                 document.getElementById("result").innerHTML =  response.message;          
            }
            else
            {
                 document.getElementById("result").innerHTML = response.message;          
            }

        }       
    }); 
}

在PHP代码中

<?php
$response= array();
if (isset($_POST) && !empty($_POST)){        
    // Make a array with the values
    $vals = $_POST;      
    $response['data']=json_encode($vals);     // Now we want to JSON     
    $response["type"]="success";
    $response["message"]="Successfully posted";
}
else
{
    $response=array(
       "type"=>"error",
       "message"=>"invalid post method"
    );
}
ob_clean();
echo json_encode($response);

jQuery AJAX没有得到PHP的响应

2 个答案: