使用 XMLHttpRequest 的 X 域发布答案

【问题标题】：X-Domain Post using XMLHttpRequest使用 XMLHttpRequest 的 X 域发布
【发布时间】：2015-01-22 13:02:33
【问题描述】：

我有以下代码块：

console.log(1);
            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'http://anothersite.com/deal-with-data.php');
            xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
            console.log(2);
            xhr.onreadystatechange = function () {
                console.log(3);
                if (this.status == 200 && this.readyState == 4) {
                       console.log(4);
                       xhr.send("formType="+thisFormType+
                        "&mediaCode="+3478+
                        "&car="+carID+
                        "&title="+$('#title').val()+
                        "&firstname="+$('#firstname').val()+
                        "&surname="+$('#lastname').val()+
                        "&tel="+$('#telephone').val()+
                        "&email="+$('#emailaddress').val()+
                        "&postcode="+$('#postcode').val()+
                        "&add1="+$('#add1').val()+
                        "&add2="+$('#add2').val()+
                        "&add3="+$('#add3').val()+
                        "&town="+""+
                        "&county="+""+
                        "&optin-post="+$('#optin-post').attr('checked')+
                        "&optin-tel="+$('#optin-tel').attr('checked')+
                        "&optin-email="+$('#optin-email').attr('checked')+
                        "&optin-sms="+$('#optin-sms').attr('checked')+
                        "&tarID="+targetID+
                        "&campID="+campaignID+
                        "&subID="+subjectID
                    );
                    console.log(5);
                }
            }
            console.log(6);

所以，除了xhr.onreadystatechange 之外的所有东西都会触发——我从来没有得到console.log(4)——我在 PHP 和 htaccess 中启用了Access-Control-Allow-Origin，并尝试了名副其实的大量 Javascript 发布函数。

问题是，作为一项要求，我需要将数据从不支持服务器端语言的服务器上的表单发布到另一个域来处理数据。

有什么想法吗？快把我逼疯了！

编辑：我也试过$.ajax

$.ajax({
            url: 'http://anothersite.com/deal-with-data.php',
            type: "post",
            crossDomain: true,
            data: {
                "formType":thisFormType,
                "mediaCode":3478,
                "car":$('#car').val(),
                "title":$('#title').val(),
                "firstname":$('#firstname').val(),
                "surname":$('#surname').val(),
                "tel":$('#telephone').val(),
                "email":$('#email').val(),
                "postcode":$('#postcode').val(),
                "add1":$('#add1').val(),
                "add2":$('#add2').val(),
                "add3":$('#add3').val(),
                "town":"",
                "county":"",
                "optin-post":$('#opt-post').attr('checked'),
                "optin-tel":$('#opt-tel').attr('checked'),
                "optin-email":$('#opt-email').attr('checked'),
                "optin-sms":$('#opt-sms').attr('checked'),
                "tarID":targetID,
                "campID":campaignID,
                "subID":subjectID
            },
            beforeSend: function() {
                $('#submit').val('Sending...').attr('disabled','disabled');
            },
            success: function(data) {
                console.log("success call");
                console.log(data);
            },
            error: function(err) {
                console.log("error call");
                console.log(err);
            }
        });

现在我也尝试在 httpd.conf 中启用它：https://serverfault.com/a/378776/36601

【问题讨论】：

如问题所述：“所以，除了xhr.onreadystatechange 之外的所有东西都会触发 - 我从来没有得到console.log(4)”
xhr.send 不应在onreadystatechange 回调中
@Musa - 啊，那我该如何让这段代码真正起作用呢？ ://
“我将如何让这段代码真正起作用” 将发送从 onreadystatechange 中取出，这样您就可以真正触发请求。但是如果 jQuery 版本不起作用，你还有其他问题。

标签： javascript php ajax xmlhttprequest xdomainrequest

【解决方案1】：

你不应该在 xhr.onreadystatechange 中传递xhr.send。执行以下操作：

var xhr = new XMLHttpRequest();

xhr.open('POST', 'myurl', true);
xhr.onload = function () {
    if (xhr.status === 200 && xhr.readyState === 4) {
        // do some cool stuff
        console.log('You got a successfull request');
    }
};

xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
xhr.send(); // pass your params here

【讨论】：

我现在收到XMLHttpRequest cannot load http://MYURL/test.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://asite.local:8080' is therefore not allowed access.。但我在htaccess 和php 文件中设置了access-control-allow-origin。

【解决方案2】：

您可能还需要设置 Access-Control-Allow-Methods: POST 标头。阅读更多关于https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

【讨论】：

我已经设置了 content-type、access-control-allow-origin 和 access-control-allow-methods: POST，但我仍然收到 x 域错误 :(
您是否尝试从 HTTP 页面调用 HTTPS 服务？