jQuery ajax 应用程序和 tomcat 服务器的 CORS 实现/启用？答案

【问题标题】：CORS implementation/enabling for jQuery ajax application and tomcat server?jQuery ajax 应用程序和 tomcat 服务器的 CORS 实现/启用？
【发布时间】：2016-09-07 23:29:21
【问题描述】：

尽管有数百个关于 CORS 的主题，但我找不到我想要的或者没有任何东西可以帮助我解决我的问题。

我的情况是，

我有一个在 http://localhost:8011 上运行的应用程序，它需要消耗在另一台服务器上运行的一些服务 http://localhost:8022
我使用jQuery(1.7.1) ajax在另一台服务器调用服务，

var Request = '<?xml version="1.0" encoding="UTF-8"?> \
                    <SOAP-ENV:Envelope xmlns:SOAP-ENV="http://schemas.xmlsoap.org/soap/envelope/" xmlns:SOAP-ENC="http://schemas.xmlsoap.org/soap/encoding/" xmlns:xsd="http://www.w3.org/2001/XMLSchema"> \
                      <SOAP-ENV:Body> \
                        <TicorRequest xmlns="urn:Ticor" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" ServiceName="Quote_Gen"> \
                          <WorkDocuments> \
                            <Premium_details id="Premium_details_id_1"> \                            
                              <quote_components id="Quote_components_id_1"> \
                                <AAC_Membership>400000</AAC_Membership> \
                                <Adjustment_fee>2000</Adjustment_fee> \     
                              </quote_components> \
                            </Premium_details> \                            
                          </WorkDocuments> \
                        </TicorRequest> \
                      </SOAP-ENV:Body> \
                    </SOAP-ENV:Envelope>';

var TicorService = $.ajax({
                            type: "POST",
                            processData: false,
                            url: "http://localhost:8022/axis/services/Ticor",
                            data: Request,
                            beforeSend: function(xhr){xhr.setRequestHeader('SOAPAction', 'urn:Ticor'); },                                                 
                            xhrFields: { withCredentials: false },          
                            contentType: "text/xml; charset=\"utf-8\"",
                            crossDomain: true,                          
                            dataType: "xml",
                            success: function(data, status, req)
                            {
                              alert(data);
                            },
                            error: function(XMLHttpRequest, textStatus, errorThrown)
                            {
                              alert(errorThrown);
                            },
                            complete: function(XMLHttpRequest, textStatus)
                            {                           

                            }
                    });

但我在 Chrome 中收到以下错误消息。

XMLHttpRequest 无法加载 http://localhost:8022/axis/services/Ticor。对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，Origin 'http://localhost:8011' 不允许访问。 响应的 HTTP 状态代码为 200。

然后我尝试在Tomcat服务器（即7.0.42）的web.xml文件中添加以下内容。

    <filter>
      <filter-name>CorsFilter</filter-name>
      <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
      <init-param>
        <param-name>cors.allowed.origins</param-name>
        <param-value>*</param-value>
      </init-param>
      <init-param>
        <param-name>cors.allowed.methods</param-name>
        <param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>
      </init-param>
      <init-param>
        <param-name>cors.allowed.headers</param-name>
        <param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
      </init-param>
      <init-param>
        <param-name>cors.exposed.headers</param-name>
        <param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
      </init-param>
      <init-param>
        <param-name>cors.support.credentials</param-name>
        <param-value>true</param-value>
      </init-param>
      <init-param>
        <param-name>cors.preflight.maxage</param-name>
        <param-value>10</param-value>
      </init-param>
    </filter>
    <filter-mapping>
      <filter-name>CorsFilter</filter-name>
      <url-pattern>/*</url-pattern>
    </filter-mapping>

添加上述内容后，我得到 相同的错误消息，但 响应的 HTTP 状态代码为 403

你能告诉我我在这里缺少什么吗？还是替代品？

【问题讨论】：

标签： jquery ajax tomcat cors cross-domain

【解决方案1】：

您的 javascript 执行 xhr.setRequestHeader('SOAPAction', 'urn:Ticor'); 以发送标头 SOAPAction。但是这个不在 cors.allowed.headers 中。您必须修改 web.xml 中的过滤器配置：

<init-param>
    <param-name>cors.allowed.headers</param-name>
    <param-value>Content-Type,X-Requested-With,Accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers,SOAPAction</param-value>
</init-param>

更新

将参数值 accept 更改为 Accept。

【讨论】：

【解决方案2】：

我遇到了同样的问题，发现当在 chrome 中向 localhost 上的不同源请求时，总是会出现这个错误。我尝试在 IE 中运行，然后它运行良好。我以前在 chrome 中运行的解决方案是禁用 CORS - chrome 上的安全性：

运行 --> Chrome.exe --disable-web-security

这是一个参考，说 chrome 不支持 localhost 的 CORS 请求，请参阅链接：https://bugs.chromium.org/p/chromium/issues/detail?id=67743

另见 stackoverflow 帖子：Deadly CORS when http://localhost is the origin

【讨论】：