为什么 ajax 有时会 urlencoded 序列化数据而有时却不会？答案

【问题标题】：Why does ajax sometimes urlencode serialised data and sometimes it doesnt?为什么 ajax 有时会 urlencoded 序列化数据而有时却不会？
【发布时间】：2015-11-16 21:10:34
【问题描述】：

当我使用 ajax 将序列化数据发送到 PHP 文件时，有时会根据我的操作方式对它进行 URL 编码。

最初我有以下运行良好的代码：

$.ajax({
        type: 'POST',
        url: 'ajax-process.php',
        data: $("#sitestructure-form").serialize(), 
        success: function(d){$("#structureupdate").html(d);}
});

数据已发送到我的 PHP 文件，我可以回显它，它看起来像这样。

[{"id":20,"children":[{"id":21}]},{"id":19},{"id":18,"children":[{"id":14}]},{"id":16},{"id":13,"children":[{"id":11}]},{"id":17},{"id":15},{"id":12}]

我想发送多个数据，我将序列化数据称为“订单”并添加了“流程”，因此我将代码更新为以下内容：

$.ajax({
        type: 'POST',
        url: 'ajax-process.php',
        data: {
            order: $("#sitestructure-form").serialize(),
            process: "sitemap-reordernavigation"
              },
        success: function(d){$("#structureupdate").html(d);}
                    });

但是，当我检索按“顺序”发送的序列化数据时，输出如下所示：

data=%5B%7B%22id%22%3A20%2C%22children%22%3A%5B%7B%22id%22%3A21%7D%5D%7D%2C%7B%22id%22%3A19%7D%2C%7B%22id%22%3A18%2C%22children%22%3A%5B%7B%22id%22%3A14%7D%5D%7D%2C%7B%22id%22%3A16%7D%2C%7B%22id%22%3A13%2C%22children%22%3A%5B%7B%22id%22%3A11%7D%5D%7D%2C%7B%22id%22%3A17%7D%2C%7B%22id%22%3A15%7D%2C%7B%22id%22%3A12%7D%5D

我能想到的解决此问题的唯一方法是使用 php 对其进行 urldecode，然后使用 str_replace 删除前面的 'data=' 位，就像这样。

    $data = str_replace("data=","",urldecode($_POST['order']));

我怎样才能让它与 AJAX 一起工作，所以我不必对它进行 urldecode？p>

我尝试使用变量并将 processData 设置为 false，但这似乎不起作用。

var order = $("#sitestructure-form").serialize();
$.ajax({
        type: 'POST',
        url: 'ajax-process.php',
        processData: false,
        data: {
            order: order,
            process: "sitemap-reordernavigation"
              },
        success: function(d){$("#structureupdate").html(d);}
                    });

我对 AJAX/Jquery 的了解相当有限，因此我们将不胜感激。

【问题讨论】：

这不是 php 的问题，而是您在 jquery 中处理数据的方式的问题。数据首先被序列化为order 键下的字符串，然后添加到您传递给数据的对象中。在内部，jquery 采用data 参数，看到它是一个对象并再次对其进行序列化，并且所有值都是 url 编码的。在order 的情况下，更是如此。
我建议查看this SO post，了解如何为序列化数据添加值。请参阅亚当的第二个答案。
谢谢大家，我通过执行以下操作修复了它： $.ajax({ type: 'POST', url: 'ajax-process.php?', data: $("#sitestructure-form ").serialize() + "&action=sitemap-reordernavigation"，成功：function(d){$("#structureupdate").html(d);} });

标签： php ajax serialization urldecode

【解决方案1】：

这是因为您第一次将序列化的文本字符串提供给 data 属性，而 jQuery 不会将其转换为序列化的字符串。第二个你将一个对象分配给具有序列化文本字符串的“order”属性的数据属性，所以jQuery基本上对它进行了双重编码。要让它按照您的意愿行事，您必须将表单转换为对象并将您的“订单”属性分配给该对象。看到这个帖子：Convert form data to JavaScript object with jQuery

// taking the example from the above link, you do this instead
order = $("#sitestructure-form"). serializeObject();

【讨论】：

好吧，我想把我的大脑围绕这个大声笑我试过了，但它似乎根本不起作用。 ' $.ajax({ type: 'POST', url: 'ajax-process.php', data: {order: $("#sitestructure-form").serializeObject(), process: "sitemap-reordernavigation"},成功：function(d){$("#structureupdate").html(d);} }); '

【解决方案2】：

通过执行以下操作修复：

 $.ajax({
        type: 'POST',
        url: 'ajax-process.php?',
        data: $("#sitestructure-form").serialize() + "&action=sitemap-reordernavigation", 
        success: function(d){$("#structureupdate").html(d);}
});

【讨论】：

这行得通，但我不建议在所有情况下都这样做。由于您只是对附加到数据的值进行硬编码，因此它可能很好（仍然不会认为它是最佳实践，但它可以工作）。如果您以任何方式从另一个表单字段或用户输入中获取附加数据，那么您需要对正在附加的键和值进行 urlencode。这就是为什么我建议使用其他 SO 线程中的方法。这将正确序列化数据，就像在表单上使用 jquery 的 serializeArray 方法一样简单，添加您自己的条目并将其传递给 param 方法。