Question

我使用dropwizard和angular作为我的UI。我的服务器和我的UI在不同的端口上运行。我的dropwizard应用程序似乎没有在响应中设置Origin标头。

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

请问您可以提出可能存在的问题

我在dropwizard上设置了CORS，如下所示

 @Override
public void run(MyAppConfiguration myAppConfiguration, Environment environment) throws Exception {
    //Force browsers to reload all js and html files for every request as angular gets screwed up
    environment.servlets()
            .addFilter("CacheBustingFilter", new CacheBustingFilter())
            .addMappingForUrlPatterns(EnumSet.of(DispatcherType.REQUEST), true, "/*");

    enableCorsHeaders(environment);

}


private void enableCorsHeaders(Environment env) {
        final FilterRegistration.Dynamic cors = env.servlets().addFilter("CORS", CrossOriginFilter.class);

        // Configure CORS parameters
               corsFilter.setInitParameter("Access-Control-Allow-Credentials", "true");
    corsFilter.setInitParameter("Access-Control-Allow-Origin", "*");
    corsFilter.setInitParameter("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Headers, Access-Control-Request-Method, Cache-Control, Pragma, Expires");
    corsFilter.setInitParameter("Access-Control-Allow-Methods\" ", "OPTIONS,GET,PUT,POST,DELETE,HEAD");


        // Add URL mapping
        cors.addMappingForUrlPatterns(EnumSet.allOf(DispatcherType.class), true, "/*");
    }

Angular Service调用REST端点

 private reconUrl = "http://localhost:8199/api/iceberg/reconciliations";

  getReconciliations(): Promise<Reconciliation[]> {
    return this.http.get(this.reconUrl)
      .toPromise()
      .then(response => response.json().data as Reconciliation[])
      .catch(this.handleError);
  }

请求 - 响应标头

http://localhost:8199/api/iceberg/reconciliations

GET http://localhost:8199/api/iceberg/reconciliations
Accept: application/json, text/plain, */*
Origin: http://localhost:4200
X-DevTools-Emulate-Network-Conditions-Client-Id: 90d7ac77-f45f-4d60-a667-a56da9e0582b
X-DevTools-Request-Id: 7836.4077
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36
Referer: http://localhost:4200/dashboard
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en-US;q=0.8,en;q=0.6

HTTP/1.1 401 Unauthorized
Date: Thu, 06 Jul 2017 10:59:14 GMT
WWW-Authenticate: BASIC realm="application"
Content-Length: 0

PreFlight OPTIONS请求/响应

我的浏览器没有执行任何飞行前请求，所以我没有看到任何OPTIONS请求 - 响应。

但我尝试使用OPTIONS命令进行CURL，如下所示，仍然看到410 Unauthorized request

的相同问题

$ curl -H "Origin: http://example.com"        
-H "Access-Control-Request-Method: POST"        
-H "Access-Control-Request-Headers: X-Requested-With"        
-X OPTIONS --verbose http://localhost:8199/api/iceberg/reconciliations

下面的卷曲命令请求 - 响应

 * STATE: INIT => CONNECT handle 0x6000578f0; line 1410 (connection #-5000)
    * Added connection 0. The cache now contains 1 members
    * STATE: CONNECT => WAITRESOLVE handle 0x6000578f0; line 1446 (connection #0)
    *   Trying ::1...
    * TCP_NODELAY set
    * STATE: WAITRESOLVE => WAITCONNECT handle 0x6000578f0; line 1527 (connection #0)
    * Connected to localhost (::1) port 8199 (#0)
    * STATE: WAITCONNECT => SENDPROTOCONNECT handle 0x6000578f0; line 1579 (connection #0)
    * Marked for [keep alive]: HTTP default
    * STATE: SENDPROTOCONNECT => DO handle 0x6000578f0; line 1597 (connection #0)
    > OPTIONS /api/iceberg/reconciliations HTTP/1.1
    > Host: localhost:8199
    > User-Agent: curl/7.54.1
    > Accept: */*
    > Origin: http://example.com
    > Access-Control-Request-Method: POST
    > Access-Control-Request-Headers: X-Requested-With
    >
    * STATE: DO => DO_DONE handle 0x6000578f0; line 1676 (connection #0)
    * STATE: DO_DONE => WAITPERFORM handle 0x6000578f0; line 1801 (connection #0)
    * STATE: WAITPERFORM => PERFORM handle 0x6000578f0; line 1811 (connection #0)
    * HTTP 1.1 or later with persistent connection, pipelining supported
    < HTTP/1.1 401 Unauthorized
    < Date: Thu, 06 Jul 2017 10:53:52 GMT
    < WWW-Authenticate: BASIC realm="application"
    < Content-Length: 0

Answer 1

如果你使用的是角度cli，那么首先你需要在项目根目录中创建一个文件。更多信息

https://github.com/angular/angular-cli/blob/cff95a732eaec9c94f41a1476ba9f2524867d11f/docs/documentation/stories/proxy.md

在您的案例中包含此内容

[
 {
  "context": "/",
  "target": "http://localhost:8199",
  "secure": false,
  "changeOrigin": true
 }
]

执行此操作后，您无需在http调用中选择端口。您的所有请求将在8199端口下。

我忘记了你需要添加这样的选项。

ng serve --proxy-config proxy-local.conf.json

希望它可以帮助你。

Answer 2

我在drop-wizard CORS配置中遇到了类似的问题，在从Web应用程序调用的每个REST API中，我都会遇到问题"Response to preflight request is not 200"。

最终，我发现问题是我在Authentication中编写的用于处理的自定义过滤器，因此预检请求被自定义过滤器拦截并返回500 Error。

我通过将CHAIN_PREFLIGHT_PARAM添加到现有的cors参数中来进行处理，如下所示

cors.setInitParameter(CrossOriginFilter.CHAIN_PREFLIGHT_PARAM, Boolean.FALSE.toString());

Answer 3

请尝试这个

cors.setInitParameter(CrossOriginFilter.ALLOWED_ORIGINS_PARAM, "*");
cors.setInitParameter(CrossOriginFilter.ACCESS_CONTROL_ALLOW_ORIGIN_HEADER,
    "X-Requested-With,Content-Type,Accept,Origin,Authorization");

即使在dropwizard应用程序中设置了标题，CORS也会失败？

3 个答案: