javascript 如何使用easyXDM通过AJAX帖子将javascript对象/数组作为键值对发送?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13077607/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I send an javascript object/array as key-value pairs via an AJAX post with easyXDM?
提问by Steve Brown
Recently I realized that I needed to use easyXDMinstead 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
来进行跨域发布请求。在设置 easyXDM 后,我看到这些功能非常紧密地排列在一起:
jQuery:
jQuery:
$.ajax({
url: "/ajax/",
method: "POST",
data: myData
});
easyXDM:
易XDM:
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 = {};
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
截图带阴影.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
截图带阴影.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 对象/键值对数组?
采纳答案by robC
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 及以下版本。
回答by Christopher.Cubells
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:
要通过 jQuery AJAX 使用来自另一台服务器的 JSON 数据,请尝试以下操作:
$.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 的形式返回结果。
回答by Boris Lipschitz
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 字符串而不是对象,因此 Index.html 不应解析属性以创建 json 结构。进入easyXDM自带的index.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 请求的情况下执行此代码。只需将 config.data 分配给数据:
data = config.data;