Jquery Ajax Post 中的 CORS 问题答案

【问题标题】：CORS issue in Jquery Ajax PostJquery Ajax Post 中的 CORS 问题
【发布时间】：2015-08-20 00:00:47
【问题描述】：

我正在从 jquery 做 ajax 发布，这样我将调用属于不同域的两个休息服务来执行我的业务逻辑。在执行此操作时，我遇到了一个 CORS 问题，并且使用 google 引用，我在我的 ajax 中添加了 crossDomain: true 现在，只有当 ajax 中没有指定标题（如下所示）并且如果我添加标题时，这才完全正常工作，我得到以下错误。请指教。

$.ajax({
    method : 'post',
    dataType: 'json',
    crossDomain: true,
    headers : {
        "country" : "us",
    },
    url : 'myurl.do',
    async : true,
    beforeSend : function() {       
    },
    success : function(data) {
        console.log('success', data);               
    },
    error : function(request, status, error) {
        console.log('Error!', status, error, request);
    },
    complete : function() {
        console.log('Completed!!');
    }
});

如果在Ajax中添加header会报错如下

“错误！” “错误”“”对象{ readyState：0，getResponseHeader：.ajax/jqXHR.getResponseHeader()，getAllResponseHeaders：.ajax/jqXHR.getAllResponseHeaders()，setRequestHeader：.ajax/jqXHR.setRequestHeader()，overrideMimeType：.ajax/jqXHR .overrideMimeType(), statusCode: .ajax/jqXHR.statusCode(), abort: .ajax/jqXHR.abort(), state: .Deferred/promise.state(), always: .Deferred/promise.always(), 然后: .Deferred/promise.then()，还有 11 个……}

【问题讨论】：

我还在响应标头中将 Access-Control-Allow-Origin 添加为 *。

标签： javascript jquery html ajax jsp

【解决方案1】：

添加自定义标头使其成为一个复杂的请求，需要 Preflight OPTIONS request 在发出 POST 请求之前接收 CORS 权限。

检查浏览器的开发人员工具“网络”选项卡。您应该在那里看到 OPTIONS 请求。

您需要将服务器配置为使用您为实际需要的 URL 设置的访问控制标头对其进行响应。

【讨论】：

谢谢。您能否指出我在服务器中配置访问控制的好资源。我正在使用 apache-tomcat 应用程序服务器，我看到了很多服务器配置到 Web 服务器的示例。
是的，我在请求中看到了 OPTIONS。那么，通过在服务器端添加访问控制配置，我应该能够发送自定义标头吗？
是的。您必须指定允许您的自定义标头。 stackoverflow.com/questions/21792759/… 涵盖为 OPTIONS 请求配置 Tomcat。