Tomcat 7 server is not sending CORS headers

Question

I am writing an Angular 4 application that makes an authenticated connection to a Tomcat 7 server. The webapp on this Tomcat server has a REST API. I have a local copy of the server on one of my machines, so I am using a request url like this:

http://xyz.local:8080/PoolParty/api/projects

I am using Safari for the request and if I check the Disable Cross-Origin Restrictions menu item then I get a json package returned and I can display it in the browser. If I don't check that menu item then I get an error:

Failed to load resource: Preflight response is not successful

I have checked the CORS filter configuration in the server, and it looks like this:

<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>
</filter>
<filter-mapping>
  <filter-name>CorsFilter</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping>

Which I think is correct from the other cases I've seen here and on other sites.

My angular request looks like this:

   private sendRequest(verb: RequestMethod, url: string, body?: Product): Observable<Product> {
      let headers = new Headers();
      headers.set("withCredentials", "true");
      headers.set("Authorization", "Basic ***********");
      headers.set("Access-Control-Allow-Origin", "*");
      headers.set("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
      headers.set("Content-Type", "text/plain");

      return this.http.request(new Request({
        method: verb,
        url: url,
        body: body,
        headers: headers
      })).map(response => response.json());
    }

So I have a couple of questions:

1. What else do I have to do in configuring my Tomcat server to send CORS headers?
2. Am I doing the right things in the request that I'm sending?

Update on Thursday 24 August:

Here are the headers and responses in the Web Inspector Network window (Safari) when I select the row with the OPTIONS method:

Request & Response:
====================
Method:      OPTIONS
Cached:      No
Status:      ___
Code:        ___
Encoded:     ___
Decoded:     ___
Compressed:  No

Request Headers:
================
Name                            Value
User-Agent                      Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_5) AppleWebKit/603.2.4 (KHTML, like Gecko) Version/10.1.1 Safari/603.2.4
Cache-Control                   max-age=0
Referer                         http://localhost:4200/ 
Origin                          http://localhost:4200
Access-Control-Request-Method   GET
Access-Control-Request-Headers  authorization
Accept                          */*

Response Headers
    No Response Headers

I've attached a couple of screenshots. The first shows the request and response. The second shows the "Preflight" error messages from the console that I've mentioned above.

Error messages logged for the preflight: