使用Jquery进行跨域Ajax调用

Question

我已经试了好几天了：

            $.ajax({
                url: 'http://otherdomain.com/mail.json' ,
                dataType: 'json',
                data: jsonObject,
                success: function(data){
                    alert("Thank you for your inquiry. We will get back to you soon.");                     
                }
            });

当我使用Chrome Postman应用程序进行测试时，mail.json API有效，响应头是这样的：

Accept-Ranges →bytes
Access-Control-Allow-Origin →*
Alternate-Protocol →80:quic,p=0.002
Cache-Control →private
Content-Encoding →gzip
Content-Length →22
Content-Type →application/json; charset=UTF-8
Date →Mon, 15 Sep 2014 05:18:09 GMT
Server →Google Frontend
Vary →Accept-Charset, Accept-Encoding, Accept-Language, Accept

我的Jquery代码可能有什么问题，因为服务器运行良好。

Answer 1

对于跨域ajax调用，最好使用JSONP。您可以在此处获取更多信息：JSONP堆叠气流

Answer 2

正如您所说，当单击此ajax调用所在的表单提交按钮时，页面将重新加载。如果使用异步提交，则应执行浏览器的默认操作。例如，

$('submit').click(function(e){
    //prevent default action
    e.preventDefault();
    $.ajax({
       url: ,
       success: function(res) {
       }
    })
})

Answer 3

URL http://otherdomain.com/mail.json来自另一个域。根据"同源策略"，您应该无法发送请求（除非您只是在浏览器中打开HTML文件并部署到服务器，我想是file:///C:/Projects/HTML5/WebContent/request.html之类的）。

要进行跨域Ajax请求，您可以按照@Vivin的建议尝试JSONP。所以你的jQuery代码可能是这样的：

$.ajax({
        url: url,
        dataType: 'jsonp',
        jsonp: 'jsonpcallback',
    }).done(function(data) { // deal with your data
    });

在服务器端，您需要返回类似jsonpcallback(YOUR_DATA_IN_JSON_STRING)的内容。有关更详细的教程，您可以在线搜索。这是我写的中文教程：JSONP教程