javascript - 将 JSON 字符串发布到 PHP 页面

Question

好的，我在将 JSON 字符串发布到 PHP 页面时遇到了一些自杀式的问题。我确实已经浏览过 Google 上的前十名结果以及大量与我的问题相关的 SO 问题，但仍然无法弄清楚我做错了什么。

我在一个页面上有多个表单，我想收集所有表单字段，将它们转换成一个 JSON 字符串并将它们发布到一个 PHP 页面，其中一个脚本迭代每个项目并更新相关的数据库表。

这是我的 jQuery/JS 脚本，用于从所有表单中收集数据:

var photo_annotations = {};

$('form').each(function(i) {
    var id = $(this).attr('id');
    photo_annotations[id] = {
        caption: $('#'+id+'_caption').val(),
        keywords: $('#'+id+'_keywords').val(),
        credit: $('#'+id+'_credit').val(),
        credit_url: $('#'+id+'_credit_url').val()
    };
});

如果我 console.log 我的 photo_annotations 对象，这就是生成的内容，基于两种形式的示例:

({11:{caption:"Caption for first photo.", keywords:"Keyword1, Keyword2, Keyword3", credit:"Joe Bloggs", credit_url:"www.a-domain.com"}, 12:{caption:"Caption for Lady Gaga.", keywords:"Keyword3, Keyword4", credit:"John Doe", credit_url:"www.another-domain.com"}})

然后我需要将其作为字符串/JSON 发布到 PHP 页面，所以我这样做了:

$.ajax({
    type: 'POST',
    dataType: 'html',
    url: 'ajax/save-annotations.php',
    data: { data: JSON.stringify(photo_annotations) },
    contentType: "application/json; charset=utf-8",
    success: function(data) {
        if (data) {
        $('#form_results').html(data);
        } else {
        alert("No data");   
        }
    }
});

在我的 PHP 页面上，我有这个:

<?php
//print_r($_POST['data']);
$decoded = json_decode($_POST['data'],true);
print_r($decoded);
?>

现在，这不是我尝试过的唯一方法。我试图从 AJAX 脚本中删除所有 JSON 设置，以便只发送一个纯字符串。我试过删除 contentType 和 JSON.stringify 但还是不行。我的 PHP 页面无法获取我发送的数据。

请帮助我朝着正确的方向前进。我已经到了无法记住我尝试过的所有变体的地步，这个小脚本现在是第 2 天!

设法修复它

我重写了我的 AJAX 函数并且它起作用了。我不知道出了什么问题，但决定使用非常基本的数据字符串 test=hello world 测试我的 AJAX 函数，发现无法从 PHP 页面读取任何 POST 数据，即使 Firebug 说该页面确实收到了与我发送的内容相匹配的发布数据。很奇怪。不管怎样，这是修改后的 AJAX 脚本:

var the_obj = JSON.stringify(photo_annotations);
var post_data = "annotations="+the_obj;
$.ajax({
    url: 'ajax/save-annotations',
    type: 'POST',
    data: post_data,
    dataType: 'html',
    success: function(data) {
        $('#form_results').html(data);
    }
});

Answer 1

尝试:

  $.ajax({
    // ...
    data: { data: JSON.stringify(photo_annotations) },
    // ...
  });

如果您只是将“数据”属性设置为一个字符串，那么 jQuery 会认为您想将它用作实际的查询字符串，而当它是一团 JSON 时，这显然是行不通的。如上所述，当您向 jQuery 传递一个对象 时，它将对属性名称和值(您的 JSON blob)进行适当的 URL 编码，并为您创建查询字符串。您应该在服务器上获得一个“数据”参数，它的值将是 JSON 字符串。