angular - CORS - 从 Angular 调用 Tomcat 上的休息服务

Question

我正在尝试从 Angular 4 调用部署在 Tomcat 8 上的 REST 服务。由于这两个服务都在不同的域上运行，因此预计会出现 CORS 问题。因此，在 tomcat/conf/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,Authorization,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>
</filter>
<filter-mapping>
  <filter-name>CorsFilter</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping> 

这就是我从 Angular 发送 GET 请求的方式

var basicOptions:RequestOptionsArgs = {
  url: 'http://server3:7000/myrest/info',
  method: RequestMethod.Get,
  search: null,
  headers: new Headers(
    {'Authorization': 'Basic AG1hZG1pbjpkZW1vLmRlbW8=' },
    ),
  body: null
};

basicOptions.headers.append('Content-Type', 'application/json');

var reqOptions = new RequestOptions(basicOptions);
var req = new Request(reqOptions);
return this.http.request( req );

由于我发送的是 Authorization header ，它也被添加到 Tomcat 的“cors.allowed.headers”参数中。

当我从 Chrome 调用 REST 服务时，它总是给我一个“无效的 CORS 请求”错误(网络选项卡 -> 预览)。下面是浏览器控制台的错误

XMLHttpRequest cannot load http://server3:7000/myrest/info. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access. The response had HTTP status code 403.

我还需要做些什么才能让它发挥作用吗？

Answer 1

Günter Zöchbauer 是对的。它与 Angular 无关。即使使用您添加的过滤器，服务器也未配置为接受来自其他域的请求。要配置您的服务器，您可以查看此 answer

请注意，您有一个预检请求，因为您发送了自定义的 http header (请参见下图)。