如何使用easyXDM通过AJAX post将javascript对象/数组作为键-值对发送?

Recently I realized that I needed to use easyXDM instead of jQuery's $.ajax in order to make a cross domain post request. After getting easyXDM set up I see that the functions line up fairly closely:

最近我意识到我需要使用easyXDM而不是jQuery的$。ajax用于发出跨域post请求。在建立easyXDM之后，我发现函数非常接近:

jQuery:

$.ajax({
    url: "/ajax/",
    method: "POST",
    data: myData
});

easyXDM:

xhr.request({
    url: "/ajax/",
    method: "POST",
    dataType: 'json', // I added this trying to fix the problem, didn't work
    data: myData
});

myData is setup something like:

我的数据是这样设置的:

myData = {};
myData[1] = 'hello';
myData[2] = 'goodbye';
myData[3] = {};
myData[3][1] = 'sub1';
myData[3][2] = 'sub2';
myData[3][3] = 'sub3';

When I make the request with jQuery it handles the sub fields properly, but not with easyXDM.

当我使用jQuery发出请求时，它会正确地处理子字段，但不会使用easyXDM。

Here is how the POST request comes into the server with jQuery:

以下是POST请求如何通过jQuery进入服务器:

screenshot-with-shadow.png http://img37.imageshack.us/img37/4526/screenshotwithshadow.png

screenshot-with-shadow。png http://img37.imageshack.us/img37/4526/screenshotwithshadow.png

And here is how it comes in with easyXDM:

下面是easyXDM的由来:

screenshot-with-shadow.png http://img204.imageshack.us/img204/4526/screenshotwithshadow.png

screenshot-with-shadow。png http://img204.imageshack.us/img204/4526/screenshotwithshadow.png

How can I send an javascript object/array of key-value pairs via an easyXDM / XHR request like jQuery does?

如何像jQuery一样通过easyXDM / XHR请求发送一个javascript对象/键值对数组?

3 个解决方案

#1

In light of the limitations of easyXDM discussed in the comments, the only way you can use it would be to serialize your data manually when passing it to .request i.e.

考虑到评论中讨论的easyXDM的局限性，您使用它的唯一方法是在将数据传递给.request时手动序列化数据，即。

xhr.request({
    url: "/ajax/",
    method: "POST",
    data: {jsonData: JSON.stringify(myData)}
});

Alternatively you could create your own postMessage solution but you will be excluding IE7 and below.

您也可以创建自己的postMessage解决方案，但是您将排除IE7和以下版本。

#2

I think you are mistaken about sending a request cross-domain via AJAX. You CAN indeed send a request cross-domain via AJAX regardless of the JavaScript API. However, in order to receive a response cross-domain, the response needs to be of data type JSONP.

我认为通过AJAX发送请求跨域是错误的。无论JavaScript API如何，您都可以通过AJAX发送请求跨域。但是，为了接收跨域响应，响应必须是数据类型JSONP。

JSONP is simply JSON with padding, for example:

JSONP只是带有填充的JSON，例如:

JSON:

JSON:

{ Key: "Hello", Value: "World" }

JSONP:

JSONP:

callback({ Key: "Hello", Value: "World" })

It is a subtle difference but JSONP by-passes browser same-origin policy and allows you to consume JSON data served by another server.

这是一个细微的区别，但是JSONP绕过了浏览器的同源策略，允许您使用由另一个服务器提供的JSON数据。

To consume JSON data coming from another server via jQuery AJAX try this:

要使用来自另一个服务器的JSON数据，请使用jQuery AJAX:

$.ajax({
    url: "http://mydomain.com/Service.svc/GetJSONP?callback=callback",
    dataType: "jsonp",
    data: myData,
    success: function(data) {
        alert(data);
    }
});

For this to work you must make sure that your web service is returning results as JSONP and not JSON.

为此，必须确保web服务以JSONP而不是JSON的形式返回结果。

#3

As easyXDM can't serialize properly you need to serialize data manually:

由于easyXDM不能正常序列化，需要手动序列化数据:

JSON.stringify(myData)

Since the request will now contain a json string rather than object then Index.html should not parse the properties to create json structure. Go to index.html that comes with easyXDM and locate the following code:

因为请求现在将包含json字符串，而不是对象，然后是索引。html不应该解析属性来创建json结构。去索引。与easyXDM一起提供的html，并定位以下代码:

var pairs = [];
for (var key in config.data) {
    if (config.data.hasOwnProperty(key)) {
        pairs.push(encodeURIComponent(key) + "=" + encodeURIComponent(config.data[key]));
    }
}
data = pairs.join("&");

Don't execute this code in a case of POST request. Just assign config.data to data:

不要在POST请求的情况下执行此代码。只是分配配置。数据的数据:

data = config.data;

#1