从JavaScript向PHP发送JSON对象

Question

我是一名有用的助手，可以为您翻译文本。

我正在尝试从Javascript/Jquery向PHP发送JSON对象，但在控制台中收到错误消息。我做错了什么？我对JS和PHP都很陌生。

JQuery文件：

$(document).ready(function() {
    var flickr = {'action': 'Flickr', 'get':'getPublicPhotos'};
    // console.log(typeof(flickr));
    var makeFlickrCall = function(flickrObj){
        $.ajax({
            url: '../phpincl/apiConnect.php',
            type: 'POST',
            data: flickrObj
        })
        .done(function(data) {
            console.log("success");
            console.log(JSON.stringify(data));
        })
        .fail(function() {
            console.log("error");
        })
        .always(function() {
            console.log("complete");
        });
    };

    makeFlickrCall(flickr);
});

PHP文件

<?php       
    $obj = $_POST['data'];
    // print_r($obj);
    return $obj;
?>

- Vish

---

控制台显示console.log error，.fail和.always消息。 - Vish

尝试使用 print_r($_POST) 查看结果。 - Amit Garg

这意味着如果您想将变量flickrObj作为数据发送，您需要将其设置为全局变量。那里面是什么？ - Developerium

这是我的变量 flickr = {'action': 'Flickr', 'get':'getPublicPhotos'}; - Vish

你需要使用 $_POST['action'] 来获取 action 的值，使用 $_POST['get'] 来获取 get 的值。如果你只是想返回它，那么可以使用 echo json_encode($_POST);。 - Amit Garg

Answer 1

标准的jQuery .ajax() 方法使用 data 属性创建一个 x-www-form-urlencoded 字符串，以便在请求主体中传递。类似这样：

action=Flickr&get=getPublicPhotos

因此，你的PHP脚本不应该寻找$_POST ['data']，而是寻找$_POST ['action']和$_POST ['get']。

如果您想将原始JSON数据有效载荷发送到PHP，请执行以下操作...

将AJAX contentType参数设置为application/json并将您的JSON对象的字符串化版本作为data有效载荷发送，例如：

$.ajax({
    url: '../phpincl/apiConnect.php',
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify(flickrObj),
    dataType: 'json'
})

您的PHP脚本将从php://input流中读取数据载荷，例如：

$json = file_get_contents('php://input');

你可以将其解析为 PHP 对象或数组...

$dataObject = json_decode($json);
$dataArray = json_decode($json, true);

如果你只是想将它回显给客户端...

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

// unmodified
echo $json;

// or if you've made changes to say $dataArray
echo json_encode($dataArray);

- Phil

---

我需要做什么才能使 $_POST['data'] 正常工作并将对象返回给 JavaScript？ - Vish

@Phil 非常有帮助的答案，我能否让php返回执行进度多次以了解当前情况？因为我的php执行时间太长了。 - Yousif

Answer 2

Phil的回答非常好，但由于OP标题说

从JavaScript（不是jQuery）发送JSON对象到PHP

这是使用（vanilla）JavaScript完成它的方法，以防有人正在寻找这种方法：

var jsondata;
var flickr = {'action': 'Flickr', 'get':'getPublicPhotos'};
var data = JSON.stringify(flickr);

var xhr = new XMLHttpRequest();
xhr.open("POST", "../phpincl/apiConnect.php", !0);
xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhr.send(data);
xhr.onreadystatechange = function () {
    if (xhr.readyState === 4 && xhr.status === 200) {
        // in case we reply back from server
        jsondata = JSON.parse(xhr.responseText);
        console.log(jsondata);
    }
}

注意，我们仍然需要使用 JSON.parse() 将服务器的响应转换为 JavaScript 的 对象。

现在，在服务器端（基于 Phil 的回答），如果您要向客户端发送一个响应，您可以这样做：

header('Content-type: application/json');
$json = file_get_contents('php://input');
$json_decode = json_decode($json, true); 
$json_encode = json_encode($json_decode);
echo $json_encode;

注意:

先解码再重新编码原始json输入的原因是为了正确地转义数据中可能存在的URL中的斜杠，例如：

json_encode将会把这个URL转换成：

http://example.com

转换为

http:\/\/example.com

... 这在 OP 中并不是这样，但在其他一些情况下很有用。

- JFK

---

感谢您的回复JFK，我的标题确实是Javascript，但我在描述中已经指定了Javascript / Jquery。 - Vish

@Vish：没问题，我只是提供了一种仅使用JavaScript的方法来完成它，以防有人不想包含jQuery。 - JFK

感谢您的努力，我很高兴知道解决问题的两种方法 :) - Vish

Answer 3

使用：

makeFlickrCall( { data: JSON.stringify( flickr )} );

代替

makeFlickrCall(flickr);

您的服务器端脚本应按以下方式接收您的JSON：

data="{"action":"Flickr","get":"getPublicPhotos"}"

- PeterKA