如何通过JavaScript发送跨域POST请求?
注释-它不应该刷新页面，然后我需要抓取并解析响应。
当前回答
还有一种方法(使用html5特性)。你可以使用代理iframe托管在另一个域上，你用postMessage发送消息到那个iframe，然后iframe可以做POST请求(在同一个域上)和postMessage返回到父窗口。
sender.com上的家长
var win = $('iframe')[0].contentWindow
function get(event) {
if (event.origin === "http://reciver.com") {
// event.data is response from POST
}
}
if (window.addEventListener){
addEventListener("message", get, false)
} else {
attachEvent("onmessage", get)
}
win.postMessage(JSON.stringify({url: "URL", data: {}}),"http://reciver.com");
Iframe在reciver.com上
function listener(event) {
if (event.origin === "http://sender.com") {
var data = JSON.parse(event.data);
$.post(data.url, data.data, function(reponse) {
window.parent.postMessage(reponse, "*");
});
}
}
// don't know if we can use jQuery here
if (window.addEventListener){
addEventListener("message", listener, false)
} else {
attachEvent("onmessage", listener)
}
其他回答
还有一种方法(使用html5特性)。你可以使用代理iframe托管在另一个域上，你用postMessage发送消息到那个iframe，然后iframe可以做POST请求(在同一个域上)和postMessage返回到父窗口。
sender.com上的家长
var win = $('iframe')[0].contentWindow
function get(event) {
if (event.origin === "http://reciver.com") {
// event.data is response from POST
}
}
if (window.addEventListener){
addEventListener("message", get, false)
} else {
attachEvent("onmessage", get)
}
win.postMessage(JSON.stringify({url: "URL", data: {}}),"http://reciver.com");
Iframe在reciver.com上
function listener(event) {
if (event.origin === "http://sender.com") {
var data = JSON.parse(event.data);
$.post(data.url, data.data, function(reponse) {
window.parent.postMessage(reponse, "*");
});
}
}
// don't know if we can use jQuery here
if (window.addEventListener){
addEventListener("message", listener, false)
} else {
attachEvent("onmessage", listener)
}
我认为最好的方法是使用XMLHttpRequest(例如:jQuery中的$.ajax()， $.post())与跨起源资源共享polyfills之一https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills#wiki-CORS
保持简单:
跨域: 使用crossDomain: true， 不应该刷新页面: 不，它不会刷新页面，因为当服务器发送回响应时将调用成功或错误异步回调。
示例脚本:
$.ajax({
type: "POST",
url: "http://www.yoururl.com/",
crossDomain: true,
data: 'param1=value1¶m2=value2',
success: function (data) {
// do something with server response data
},
error: function (err) {
// handle your error logic here
}
});
创建一个iFrame， 在里面放入一个隐藏输入的表单， 将表单的动作设置为URL， 向文档中添加iframe 提交表格
伪代码
var ifr = document.createElement('iframe');
var frm = document.createElement('form');
frm.setAttribute("action", "yoururl");
frm.setAttribute("method", "post");
// create hidden inputs, add them
// not shown, but similar (create, setAttribute, appendChild)
ifr.appendChild(frm);
document.body.appendChild(ifr);
frm.submit();
你可能想样式iframe，隐藏和绝对定位。不确定跨站点发布将被浏览器允许，但如果是这样，这是如何做到的。
如果你可以访问跨域服务器，并且不想在服务器端做任何代码更改，你可以使用一个名为“xdomain”的库。
工作原理:
步骤1: 服务器1:包含xdomain库，并将跨域配置为从域:
<script src="js/xdomain.min.js" slave="https://crossdomain_server/proxy.html"></script>
步骤2: 在跨域服务器上，创建一个proxy.html文件，并将服务器1作为主服务器:
proxy.html:
<!DOCTYPE HTML>
<script src="js/xdomain.min.js"></script>
<script>
xdomain.masters({
"https://server1" : '*'
});
</script>
步骤3:
现在，您可以从server1对proxy.html作为端点进行AJAX调用。这是绕过CORS请求。图书馆内部使用iframe解决方案，它与凭证和所有可能的方法一起工作:GET, POST等。
查询ajax代码:
$.ajax({
url: 'https://crossdomain_server/proxy.html',
type: "POST",
data: JSON.stringify(_data),
dataType: "json",
contentType: "application/json; charset=utf-8"
})
.done(_success)
.fail(_failed)
