title: CORS - Calling rest services on Tomcat from angular
body: <p>I am trying to call REST services deployed on Tomcat 8 from Angular 4. Since both these are running on separate domains, CORS issue is expected. So, in the tomcat/conf/web.xml, I have added the below filter</p>
  
  <pre><code>&lt;filter&gt;
    &lt;filter-name&gt;CorsFilter&lt;/filter-name&gt;
    &lt;filter-class&gt;org.apache.catalina.filters.CorsFilter&lt;/filter-class&gt;
    &lt;init-param&gt;
      &lt;param-name&gt;cors.allowed.origins&lt;/param-name&gt;
      &lt;param-value&gt;*&lt;/param-value&gt;
    &lt;/init-param&gt;
    &lt;init-param&gt;
      &lt;param-name&gt;cors.allowed.methods&lt;/param-name&gt;
      &lt;param-value&gt;GET,POST,HEAD,OPTIONS,PUT&lt;/param-value&gt;
    &lt;/init-param&gt;
    &lt;init-param&gt;
      &lt;param-name&gt;cors.allowed.headers&lt;/param-name&gt;
      &lt;param-value&gt;Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Authorization,Access-Control-Request-Headers&lt;/param-value&gt;
    &lt;/init-param&gt;
    &lt;init-param&gt;
      &lt;param-name&gt;cors.exposed.headers&lt;/param-name&gt;
      &lt;param-value&gt;Access-Control-Allow-Origin,Access-Control-Allow-Credentials&lt;/param-value&gt;
    &lt;/init-param&gt;
  &lt;/filter&gt;
  &lt;filter-mapping&gt;
    &lt;filter-name&gt;CorsFilter&lt;/filter-name&gt;
    &lt;url-pattern&gt;/*&lt;/url-pattern&gt;
  &lt;/filter-mapping&gt; 
  </code></pre>
  
  <p>This is how I am sending the GET request from Angular</p>
  
  <pre><code>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 );
  </code></pre>
  
  <p>Since, I am sending the Authorization header, it is also added in the 'cors.allowed.headers' param in Tomcat.</p>
  
  <p>When I call the REST service from Chrome, it always gives me a 'Invalid CORS request' error (Network tab -> Preview). Below is the error in browser console</p>
  
  <blockquote>
    <p>XMLHttpRequest cannot load <a href="http://server3:7000/myrest/info" rel="nofollow noreferrer">http://server3:7000/myrest/info</a>. Response
    to preflight request doesn't pass access control check: No
    'Access-Control-Allow-Origin' header is present on the requested
    resource. Origin '<a href="http://localhost:4200" rel="nofollow noreferrer">http://localhost:4200</a>' is therefore not allowed
    access. The response had HTTP status code 403.</p>
  </blockquote>
  
  <p>Is there something else that I need to do to make it work?</p>