Jquery Ajax Post 中的 CORS 问题

Posted

技术标签:

【中文标题】Jquery Ajax Post 中的 CORS 问题【英文标题】:CORS issue in Jquery Ajax Post 【发布时间】: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 添加为 *。 【参考方案1】:

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

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

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

【讨论】:

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

以上是关于Jquery Ajax Post 中的 CORS 问题的主要内容,如果未能解决你的问题,请参考以下文章

CORS 问题 - POST 时的 Access-Control-Allow-Origin 错误(Jquery Ajax)

jQuery Ajax cors IE10 不工作

AWS S3 静态站点 CORS jquery ajax POST 到 API Gateway

启用从 jQuery ajax 到不在 IIS 中托管的 WCF 服务的 CORS POST

asmx web 服务 - jQuery ajax post json (500 错误) - CORS (Access-Control-Allow-Origin 设置为 *)

jQuery ajax CORS 请求