使用jQuery发送JSON数据


73

为什么在下面的代码中将数据发送为City=Moscow&Age=25JSON格式?

var arr = {City:'Moscow', Age:25};
$.ajax(
   {
        url: "Ajax.ashx",
        type: "POST",
        data: arr,
        dataType: 'json',
        async: false,
        success: function(msg) {
            alert(msg);
        }
    }
);

2
dataType是返回的内容,而不是发送的内容!
加尔

尝试将“ dataType”放在数据之前...不确定。
daGrevis

1
为防止data将其转换为查询字符串格式设置processData: false。请参阅api.jquery.com/jquery.ajax/#sending-data-to-server
Paul

Answers:


181

因为您既未指定请求内容类型,也未指定正确的JSON请求。这是发送JSON请求的正确方法:

var arr = { City: 'Moscow', Age: 25 };
$.ajax({
    url: 'Ajax.ashx',
    type: 'POST',
    data: JSON.stringify(arr),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: false,
    success: function(msg) {
        alert(msg);
    }
});

注意事项:

  • 使用该JSON.stringify方法将javascript对象转换为本地和内置于现代浏览器中的JSON字符串。如果要支持较旧的浏览器,则可能需要包含json2.js
  • 使用contentType属性指定请求内容类型,以便向服务器指示发送JSON请求的意图
  • dataType: 'json'属性用于服务器期望的响应类型。jQuery足够智能,可以从服务器响应标头中进行猜测Content-Type。因此,如果您有一个或多或少遵守HTTP协议并响应Content-Type: application/json您的请求的Web服务器,则jQuery会自动将响应解析为javascript对象并返回到success回调中,因此您无需指定该dataType属性。

注意事项:

  • 您所说arr不是数组。这是一个具有属性(CityAge)的javascript对象。数组[]在javascript中用表示。例如[{ City: 'Moscow', Age: 25 }, { City: 'Paris', Age: 30 }],一个包含2个对象的数组。

嗨,我已经在代码中对其进行了测试,但是无法正常工作pastie.org/pastes/7975866/text为什么?
米开朗基罗

从技术上讲,JavaScript中的对象只是关联数组。因此,尽管这样做很令人困惑,但在JavaScript中将对象调用为数组并不是一个错误。有关更多信息,请参见:JavaScript数据结构
Nadav

@Nadav令人困惑的事实是不这样做的充分理由。
Madbreaks '18

@Darin拯救了我的一天,谢谢
anshul

9

因为默认情况下jQuery会序列化作为data参数传递给的对象$.ajax。它用于$.param将数据转换为查询字符串。

从jQuery文档中获得$.ajax

[ dataargument]转换为查询字符串(如果还没有字符串)

如果要发送JSON,则必须自己编码:

data: JSON.stringify(arr);

请注意,JSON.stringify仅在现代浏览器中存在。要获得旧版支持,请查看json2.js


4

我写了一个简短的便捷函数来发布JSON。

$.postJSON = function(url, data, success, args) {
  args = $.extend({
    url: url,
    type: 'POST',
    data: JSON.stringify(data),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: true,
    success: success
  }, args);
  return $.ajax(args);
};

$.postJSON('test/url', data, function(result) {
  console.log('result', result);
});

1

您需要设置正确的内容类型并对您的对象进行字符串化。

var arr = {City:'Moscow', Age:25};
$.ajax({
    url: "Ajax.ashx",
    type: "POST",
    data: JSON.stringify(arr),
    dataType: 'json',
    async: false,
    contentType: 'application/json; charset=utf-8',
    success: function(msg) {
        alert(msg);
    }
});

0

它被序列化,以便URI可以默认读取POST请求中的名称值对。您可以尝试将processData:false设置为参数列表。不确定是否有帮助。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.