跨域ajax POST到web-api总是返回空响应

Question

我想POST HTML表单到web-api。

如果我在其他领域使用jQuery执行ajax POST，一切都OK，我收到200 OK ，但在firebug和响应选项卡中，我收到如下图所示的空白响应。这是我的jQuery代码:

var formData = new FormData($('form')[0]);
                var response = '';
                $.ajax({
                    url: 'http://localhost:2143/api/controller',
                    type: 'POST',
                    // Form data
                    data: formData,
                    //Options to tell JQuery not to process data or worry about content-type
                    cache: false,
                    contentType: false,
                    processData: false,
                    success : function(text)
                     {
                         response = text;
                         alert(response);
                     }
                });

Answer 1

由于浏览器内置的same origin policy restriction，不允许执行跨域AJAX调用。您有几个可能的解决方案:

1. JSONP—这里的想法是您的服务器将在回调中包装JSON响应。这只适用于GET请求，因此它可能不适合您的情况，从我可以看到，您正在尝试发送POST请求。您可以使用自定义JsonpMediaTypeFormatter，如this similar post所示。
2. CORS -服务器应该发送一个特殊的Access-Control-Allow-Origin响应HTTP头。缺点是旧的浏览器可能不支持它。以下是blog post，详细介绍了这一点。
3. 服务器端桥接。如果前两种技术不适合你，因为他们强加的限制，你可以有一个服务器端脚本在托管你的javascript的域，将作为代理之间的代理你的域和远程域托管API。在这种情况下，您将发送AJAX请求到您自己的域，该域将调用远程API并将结果返回给客户端。