Ошибка CORS при доступе к Tomcat внутри контейнера докера

Question

Я создаю приложение Angular 4, которое взаимодействует с процессом Camunda с помощью API REST. Попытка войти, сталкивается с ошибкой CORS.

Dockerfile:

FROM camunda/camunda-bpm-platform:tomcat-latest

ADD sample.war /camunda/webapps/sample.war

COPY ./web.xml /camunda/webapps/engine-rest/WEB-INF

Запуск это как:

docker build -t camunda-eval .
docker run -d --name camunda -p 8080:8080 <image>

Ошибка в консоли:

Не удалось загрузить http://localhost:8080/camunda/api/admin/auth/user/default/login/tasklist: в запрошенном ресурсе отсутствует заголовок "Access-Control-Allow-Origin". Источник ' http://localhost:4200/', следовательно, не имеет доступа.

Мой web.xml выглядит так:

<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://java.sun.com/xml/ns/javaee    http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">

  <filter>
    <filter-name>EmptyBodyFilter</filter-name>
    <filter-class>org.camunda.bpm.engine.rest.filter.EmptyBodyFilter</filter-class>
  </filter>
  <filter-mapping>
    <filter-name>EmptyBodyFilter</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>

  <filter>
    <filter-name>CacheControlFilter</filter-name>
    <filter-class>org.camunda.bpm.engine.rest.filter.CacheControlFilter</filter-class>    
  </filter>
  <filter-mapping>
    <filter-name>CacheControlFilter</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>

  <!-- Http Basic Authentication Filter -->
  <!-- <filter>
    <filter-name>camunda-auth</filter-name>
    <filter-class>
      org.camunda.bpm.engine.rest.security.auth.ProcessEngineAuthenticationFilter
    </filter-class>
    <init-param>
      <param-name>authentication-provider</param-name>
      <param-value>org.camunda.bpm.engine.rest.security.auth.impl.HttpBasicAuthenticationProvider</param-value>
    </init-param>
    <init-param>
        <param-name>rest-url-pattern-prefix</param-name>
        <param-value></param-value>
      </init-param> 
  </filter>

  <filter-mapping>
    <filter-name>camunda-auth</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping> -->

  <filter>
      <filter-name>Resteasy</filter-name>
      <filter-class>
          org.jboss.resteasy.plugins.server.servlet.FilterDispatcher
      </filter-class>
      <init-param>
          <param-name>javax.ws.rs.Application</param-name>
          <param-value>org.camunda.bpm.engine.rest.impl.application.DefaultApplication</param-value>
      </init-param>
  </filter>

  <filter-mapping>
      <filter-name>Resteasy</filter-name>
      <url-pattern>/*</url-pattern>
  </filter-mapping>
 <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>
</web-app>

Любые идеи о том, как это исправить?

Answer 1

Вы получаете эту ошибку, потому что "localhost:4200" и "localhost:8080" не являются одной и той же машиной, когда речь идет о CORS.

В общем, у вас есть 3 способа избежать этого:

1. просто скажите вашему браузеру игнорировать CORS (например, chromium-browser --disable-web-security --user-data-dir) - это самое быстрое, если вы просто хотите поиграть, но, конечно, нет производственного решения
2. установите заголовки CORS на 8080, чтобы разрешить доступ с 4200 ... здесь неприменимо (легко, так как вы не управляете приложением camunda)
3. использовать "пограничный" (или "шлюз") сервер, который внутренне перенаправляет запросы через обратное проксирование. Значение: ваш браузер общается только со шлюзом (скажем, с портом 80), и это перенаправляет запросы либо в ваш список задач (4200), либо в камунду (8080). Это стандартный способ решения этой проблемы, и вы найдете хорошую документацию, если вы ищете nginx или zuul. Это потребует дополнительного сервисного компонента.