在 IE9 + 跨域中通过 ajax (jquery) 提交表单

Question

希望你能帮助我。我在页面上有一个注册表单。该表单需要通过 AJAX 提交到不同的服务器（跨域）。

这是表格：

<form id="remindMe" method="post">
   <input type="text" name="firstname" id="firstname" required>
   <input type="text" name="lastname" id="lastname" required>
   <input type="email" name="email" id="email" required>
   <input type="submit" value="Submit">
</form>

这是我的 jQuery 提交表单的代码：

$("#remindMe").submit(function() {
    $.post('https://other-server.com/form.php', $('#remindMe').serialize()).done(function({ 
        $('#remindMe').hide(); 
        $('#remindSub').hide(); 
        $('#successMail').show();
    }); 
   return false;
});

这是 form.php

<?php
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST, GET, OPTIONS');
header('Access-Control-Max-Age: 1000');
header('Access-Control-Allow-Headers: Content-Type');
require "config.php";

$firstname = $con->real_escape_string($_POST['firstname']);
$lastname = $con->real_escape_string($_POST['lastname']);
$email = $con->real_escape_string($_POST['email']);

$con->query("INSERT INTO form (firstname,lastname,email)
VALUES ('$firstname','$lastname','$email')");

$con->close();
?>

这在所有主流浏览器上都运行良好，IE9（及更早版本）除外。据我所知，这是一个跨域问题，因为 IE9 使用 xdomainrequest 来提交表单数据。但我不知道如何编辑我的代码以使其在 IE9 上运行。

感谢您的帮助。

Answer 1

好的，现在可以了。事情是这样的：

您不能在 IE9 中通过跨域提交真实的 post 数据。但是 RAW post 数据是可能的。

所以，我遇到了一段非常有用的代码片段，我将其添加到我的 javascript 中。 JavaScript 代码现在看起来像这样：

$("#remindMe").submit(function() {

if ( window.XDomainRequest ) {
jQuery.ajaxTransport(function( s ) {
    if ( s.crossDomain && s.async ) {
        if ( s.timeout ) {
            s.xdrTimeout = s.timeout;
            delete s.timeout;
        }
        var xdr;
        return {
            send: function( _, complete ) {
                function callback( status, statusText, responses, responseHeaders ) {
                    xdr.onload = xdr.onerror = xdr.ontimeout = jQuery.noop;
                    xdr = undefined;
                    complete( status, statusText, responses, responseHeaders );
                }
                xdr = new XDomainRequest();
                xdr.onload = function() {
                    callback( 200, "OK", { text: xdr.responseText }, "Content-Type: " + xdr.contentType );
                };
                xdr.onerror = function() {
                    callback( 404, "Not Found" );
                };
                xdr.onprogress = jQuery.noop;
                xdr.ontimeout = function() {
                    callback( 0, "timeout" );
                };
                xdr.timeout = s.xdrTimeout || Number.MAX_VALUE;
                xdr.open( s.type, s.url );
                xdr.send( ( s.hasContent && s.data ) || null );
            },
            abort: function() {
                if ( xdr ) {
                    xdr.onerror = jQuery.noop;
                    xdr.abort();
                }
            }
        };
    }
});
}

    $.post('https://other-server.com/form.php', $('#remindMe').serialize()).done(function({ 
    $('#remindMe').hide(); 
    $('#remindSub').hide(); 
    $('#successMail').show();
}); 
   return false;
});

这将通过 AJAX 作为 RAW POST 数据提交表单。

现在在我的 PHP 脚本中，我添加了一些行，它们将获取原始 post 数据并将其放入普通的 $_POST 数组中。

<?php
 header('Access-Control-Allow-Origin: *');
 header('Access-Control-Allow-Methods: POST, GET, OPTIONS');
 header('Access-Control-Max-Age: 1000');
 header('Access-Control-Allow-Headers: Content-Type');
 require "config.php";

 if (isset($HTTP_RAW_POST_DATA)){
     $parts = explode('&', $HTTP_RAW_POST_DATA);
     foreach ( $parts as $part ) {
         list($key, $value) = explode('=', $part, 2);
         $_POST[$key] = urldecode($value);
     }
 }

 $firstname = $con->real_escape_string($_POST['firstname']);
 $lastname = $con->real_escape_string($_POST['lastname']);
 $email = $con->real_escape_string($_POST['email']);

 $con->query("INSERT INTO form (firstname,lastname,email)
 VALUES ('$firstname','$lastname','$email')");

 $con->close();
 ?>

现在，它适用于所有浏览器。 :-)

在 IE9 + 跨域中通过 ajax (jquery) 提交表单

Submitting a form via ajax (jquery) in IE9 + crossdomain

ajax

jquery

post

cross-domain

internet-explorer-9