JQuery - $.ajax POST 不会将 .data 发送到 Web 服务器答案

【问题标题】：JQuery - $.ajax POST does not send .data to web serverJQuery - $.ajax POST 不会将 .data 发送到 Web 服务器
【发布时间】：2011-04-08 14:11:47
【问题描述】：

我正在使用 JQuery $.ajax post 命令在我的 Web 服务器上调用 ajax 事件：

var formParams = "fe1=y&fe2=m&fe3=m";

$.ajax({
    type: 'POST',
    url: '/foo.jsp',
    async: false,
    data: formParams,
    complete: function(xmlRequestObject, successString){
        ymmReceiveAjaxResponse(xmlRequestObject, successString);
    }
});

ajax 组件成功调用网页，但不包含任何post 数据。
即 - "(HttpServletRequest) request.getParameterMap.size() == 0" - 我希望是 3，但现在是零。

将上述命令从 POST 更改为 GET 可以使一切正常。

TIA

【问题讨论】：

这个问题已经在其他线程中得到了回答，因为我刚刚偶然发现了问题的原因 - 使用 FireBug，并打开 Net sniffer do-hicky，我看到Web 服务器正在响应对网页的调用，状态为 302。稍后我将概述我对这个问题的解决方案。

标签： jquery ajax jsp post

【解决方案1】：

使用 FireBug 并打开 Net gadget 找到问题的原因。

我看到 Web 服务器在调用网页时响应状态为 302。

在 Firebug/Net 中扩展 302 请求，并检查参数、标头、响应和 HTML，很快发现它是源自服务器的应用程序特定问题。

感谢大家的反馈

【讨论】：

【解决方案2】：

试试这个：

$.ajax({
    type: 'POST',
    url: '/foo.jsp',
    async: false,
    data: { fe1: "y", fe2: "m", fe3: "m" },
    complete: function(xmlRequestObject, successString){
        ymmReceiveAjaxResponse(xmlRequestObject, successString);
    }
});

它应该可以工作。

【讨论】：

我的错误是我试图访问 $_POST['data'] .. 但如果我想这样做，我必须像这样 data : { data : ' someValue' }, .. 感谢您清除它！

【解决方案3】：

您的代码引用没问题（我在本地尝试过）。

我的猜测是您问题中的 formParams 字符串只是一个示例，实际上您正在做一些事情来动态生成该字符串，问题在于那个代码而是。

例如，您确定正确转义字符（使用encodeURIComponent）吗？或者更好的是，让 jQuery 来处理它，像这样：

$.ajax({
    type: 'POST',
    url: '/foo.jsp',
    async: false,
    data: {
        fe1: $("#somefield1").val(),
        fe2: $("#somefield2").val(),
        fe3: $("#somefield3").val()
    },
    complete: function(xmlRequestObject, successString){
        ymmReceiveAjaxResponse(xmlRequestObject, successString);
    }
});

如果你传入一个对象，jQuery 将为你处理 URI 编码。如果您真的想自己动手：

var formParams =
    "fe1=" + encodeURIComponent($("#somefield1").val()) +
    "fe2=" + encodeURIComponent($("#somefield2").val()) +
    "fe3=" + encodeURIComponent($("#somefield3").val());
$.ajax({
    type: 'POST',
    url: '/foo.jsp',
    async: false,
    data: formParams,
    complete: function(xmlRequestObject, successString){
        ymmReceiveAjaxResponse(xmlRequestObject, successString);
    }
});

我没有对字段名称进行编码，因为这些名称中没有任何特殊字符；如果您的表单名称比这更有趣，您需要这样做。

【讨论】：

你完全正确，这是存根代码；我实际上是在表单字段上调用 serialize() 方法，即 - var formParams = $("#myForm").serialize();，这似乎对我没有任何作用。
@Missy：嗯，serialize 将为您处理编码，所以不是这样。从根本上说，代码应该可以工作，并且在这方面确实可以工作，因此您必须使用调试器逐步完成并查看 jQuery 实际发送的内容。可能是 jQuery 完成了它的工作，但无论出于何种原因，将请求路由到您的 JSP 的配置都搞砸了。

【解决方案4】：

折腾了四个小时后，发现可以通过在ajaxPOST中设置contentType来实现，如下，

var dataToSend = {
     "username" : $("#username").val(),
     "password" : $("#password").val()
};

$.ajax({
   type: "POST",
   url: "somepage.jsp",
   data: dataToSend,  
   contentType: "application/x-www-form-urlencoded; charset=UTF-8", //this is must
   success: function(datum, msg, textStatus){
        $("#result").html("<h3>" + "Status : " + msg + "</h3>")
        .fadeIn("slow");
  }
});

【讨论】：

【解决方案5】：

使用success:

var formParams = "fe1=y&fe2=m&fe3=m";

$.ajax({
    type: 'POST',
    url: '/foo.jsp',
    async: false,
    data: formParams,
    success: function(data) {
       alert('response data = ' + data);
    }
});

【讨论】：

他是否使用success 或complete 与首先不发送到服务器的数据无关。（如果他愿意，他可以使用complete，它工作得很好。:-)）