Question

我使用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错误的抱怨：

否＆＃39;访问控制 - 允许 - 来源＆＃39;标头出现在请求的资源上。起源＆＃39; http://localhost＆＃39;因此不允许访问。

我在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

中的过滤器来解决此问题

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

Answer 1

如果您使用chrome进行测试，则会出现一个错误（info），该错误会使localhost与CORS标头不匹配。如果您只是测试应用程序，则可以使用指向lvh.me的域127.0.0.1（与localhost相同）。或者，正如链接中的最后一个响应所示，使用标记--disable-web-security

启动chrome

Answer 2

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

此过滤器是W3C的CORS（跨源资源）的实现   共享）规范，这是一种启用跨源的机制   请求。

过滤器的工作原理是添加所需的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

Answer 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了解详情

CORS甚至不工作在服务器中设置的标头

3 个答案: