即使在服务器中设置了标头，CORS 也无法正常工作答案

【问题标题】：CORS not working even headers set in server即使在服务器中设置了标头，CORS 也无法正常工作
【发布时间】：2015-11-19 16:27:23
【问题描述】：

我正在使用 AngularJS 向 Java 后端发送请求。

在 AngularJS 中，我是这样做的：

     return $http({
            method: 'POST',
            url: 'http://localhost:8180/sample/user',
            data: userData,
            headers: {'Content-Type': 'application/json'}
        })
            .success(function (data, status, headers) {
                alert(data);
            })
            .error(function (data, status) {
                console.log("Request failed with status: " + status);
            });

AngularJS 应用通过 http-server 命令在 localhost:8000 运行：

http-server -a localhost -p 8000

在 Java 后端，我添加了一个过滤器，并在过滤器中设置了标题：

    response.setHeader("Access-Control-Allow-Origin", "http://localhost:8000");
    response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE,PUT");
    response.setHeader("Access-Control-Max-Age", "3600");
    response.setHeader("Access-Control-Allow-Headers", "Content-Type, Origin, X-Requested-With, Accept, Access-Control-Request-Method, Access-Control-Request-Headers");
    response.setHeader("Access-Control-Allow-Credentials", "true");

此 Java 应用程序正在 localhost Tomcat 服务器上运行：localhost:8180

但我仍然在 chrome 的控制台中收到 CORS 错误提示：

请求的资源上不存在“Access-Control-Allow-Origin”标头。因此不允许访问 Origin 'http://localhost'。

我在 Response 的标头中找到了：

Allow:POST, OPTIONS
Content-Length:0
Date:Tue, 25 Aug 2015 18:19:46 GMT
Server:Apache-Coyote/1.1

有谁知道跨域请求失败的原因，即使我设置了标头？

而在 app.js 中，我也有这样的设置：

    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];

================================================ ==============================

最后我通过添加来自link 的过滤器解决了这个问题

我在下面添加了一个答案，希望这也可以帮助有类似问题的其他人。

【问题讨论】：

你有拦截器吗，如果有的话放在那里 $http.defaults.useXDomain = true;否则，请在您提出请求时添加

标签： java angularjs cors

【解决方案1】：

如果您使用 chrome 进行测试，有一个错误 (info) 会使 localhost 与 CORS 标头不匹配。如果您只是在测试您的应用程序，您可以使用指向127.0.0.1 的域lvh.me（与本地主机相同）。或者，正如链接中的最后一个响应所说，使用标志启动 chrome，--disable-web-security

【讨论】：

【解决方案2】：

您是否将 cors 定义添加到您的服务器 web.xml 定义中？我正在通过 web.xml 配置 CORS，它运行良好。

这个过滤器是 W3C 的 CORS（Cross-Origin Resource 共享）规范，这是一种实现跨域的机制请求。

过滤器通过将所需的 Access-Control-* 标头添加到 HttpServletResponse 对象。该过滤器还可以防止 HTTP 响应分裂。如果请求无效或不允许，则请求被 HTTP 状态码 403（禁止）拒绝。流程图演示此过滤器处理请求的可用。

使用此过滤器所需的最低配置是：

<filter>
  <filter-name>CorsFilter</filter-name>
  <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
</filter>
<filter-mapping>
  <filter-name>CorsFilter</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping>

链接是：https://tomcat.apache.org/tomcat-7.0-doc/config/filter.html#CORS_Filter

【讨论】：

我试过这个，我也为此添加了依赖，但我仍然得到错误

【解决方案3】：

我尝试了这篇文章中提到的许多方法，最后我用另一种方式解决了它：我在web.xml中添加了过滤器：

    <filter>
        <filter-name>CORS</filter-name>
        <filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>CORS</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

我在 pom.xml 中添加了依赖：

    <dependency>
         <groupId>com.thetransactioncompany</groupId>
         <artifactId>cors-filter</artifactId>
         <version>2.4</version>
    </dependency>

您也可以查看此CORS Filter 了解更多信息

【讨论】：