如何使用$发布对象数组。ajax(jQuery或Zepto)

I'd like to POST an array of objects with $.ajax in Zepto or Jquery. Both exhibit the same odd error, but I can't find what I'm doing wrong.

我想用$来发布一个对象数组。Zepto或Jquery中的ajax。两者都表现出相同的奇怪错误，但我找不到我做错了什么。

The data saves to the server when sent using a test client like 'RestEasy', and I can see the request getting mangled in the browser's net panel, so I believe JS is the culprit.

当使用像“RestEasy”这样的测试客户端发送数据时，数据保存到服务器上，我可以看到在浏览器的网络面板中，请求被破坏了，所以我认为JS是罪魁祸首。

If I send an array of objects as the data property of a POST, they are not properly sent.

如果我将一个对象数组作为POST的数据属性发送，它们不会被正确地发送。

Data object:

数据对象:

var postData = [
    { "id":"1", "name":"bob"}
  , { "id":"2", "name":"jonas"}
  ]

Request:

要求:

$.ajax({
  url: _saveDeviceUrl
, type: 'POST'
, contentType: 'application/json'
, dataType: 'json'
, data: postData
, success: _madeSave.bind(this)
//, processData: false //Doesn't help
});

Request body as seen in the browser:

如浏览器所示，请求主体:

"bob=undefined&jonas=undefined"

This can be seen more directly by using the $.param method that both jQuery and Zepto use to prepare POST data.

使用$可以更直接地看到这一点。jQuery和Zepto用于准备POST数据的param方法。

$.param(
  [
    { "id":"1", "name":"bob"}
  , { "id":"2", "name":"jonas"}
  ]
)
// Output: "bob=undefined&jonas=undefined"

So it seems like the preparation that these libraries do for complex post data is different than I expect.

看起来这些库为复杂的post数据所做的准备工作与我预期的有所不同。

I see this answer, but I don't want to send the data as a query param as I'm POSTing lots of content. How do I send an array in an .ajax post using jQuery?

我看到了这个答案，但我不想将数据作为查询参数发送，因为我正在发布大量内容。如何使用jQuery在.ajax post中发送数组?

What is the correct way to send multiple objects over POST using jQuery/Zepto?

使用jQuery/Zepto通过POST发送多个对象的正确方式是什么?

Using $.ajax({... data: JSON.stringify(postData) ...}) sends non-mangled content, but the server doesn't like the format.

使用$ . ajax({…数据:JSON.stringify(postData)…})发送非损坏的内容，但服务器不喜欢这种格式。

Update: Seems like JSON.stringify sends correctly formatted content. The issue is that the server side is very, very specific about the structure of the object that it wants. If I add or remove any properties from the object, it will fail the whole process rather than using the properties that do match. This is inconvenient because it's nice to use server-sent content as a view model, but view models get changed. ...Still working on the best solution.

更新:似乎是JSON。stringify发送正确格式的内容。问题是服务器端对它想要的对象的结构非常、非常具体。如果我从对象中添加或删除任何属性，它将使整个过程失败，而不是使用匹配的属性。这很不方便，因为使用服务器发送的内容作为视图模型很好，但是视图模型会被更改。还在研究最好的解决方案。

3 个解决方案

#1

Be sure to stringify before sending. I leaned on the libraries too much and thought they would encode properly based on the contentType I was posting, but they do not seem to.

在发送之前一定要严格执行。我过于依赖库，认为它们可以根据我所发布的内容类型进行适当的编码，但它们似乎没有。

Works:

工作原理:

$.ajax({
    url: _saveAllDevicesUrl
,   type: 'POST'
,   contentType: 'application/json'
,   data: JSON.stringify(postData) //stringify is important
,   success: _madeSave.bind(this)
});

I prefer this method to using a plugin like $.toJSON, although that does accomplish the same thing.

与使用$之类的插件相比，我更喜欢这种方法。toJSON，尽管它完成了同样的事情。

#2

Try the following:

试试以下:

$.ajax({
  url: _saveDeviceUrl
, type: 'POST'
, contentType: 'application/json'
, dataType: 'json'
, data: {'myArray': postData}
, success: _madeSave.bind(this)
//, processData: false //Doesn't help
});

#3

edit: I guess it's now starting to be safe to use the native JSON.stringify() method, supported by most browsers (yes, even IE8+ if you're wondering).

编辑:我想现在使用本地的JSON.stringify()方法是安全的，大多数浏览器都支持这种方法(是的，甚至IE8+如果你想知道的话)。

As simple as:

简单:

JSON.stringify(yourData)

You should encode you data in JSON before sending it, you can't just send an object like this as POST data.

在发送数据之前，您应该用JSON对数据进行编码，您不能将这样的对象作为POST数据发送。

I recommand using the jQuery json plugin to do so. You can then use something like this in jQuery:

我推荐使用jQuery json插件。然后你可以在jQuery中使用类似的东西:

$.post(_saveDeviceUrl, {
    data : $.toJSON(postData)
}, function(response){
    //Process your response here
}
);

#1