title: CORS Issue Ionic 4, WordPress 5.2 and JWT Authentication
body: <p>I am using Angular 6 and Ionic 4 with Wordpress 5.2 and JWT Authentication to access an API in wp-json. I was sure to enable CORS according to JWT Authentication and also custom CORS headers in Theme function but I am still receiving the error </p>
  
  <blockquote>
    <p>Access to XMLHttpRequest at
    '<a href="https://oc.xxxx.com/wp-json/erp/v1/crm/contacts" rel="nofollow noreferrer">https://oc.xxxx.com/wp-json/erp/v1/crm/contacts</a>' from
    origin '<a href="http://localhost:8100" rel="nofollow noreferrer">http://localhost:8100</a>' has been blocked by CORS policy:
    Request header field access-control-allow-origin is not allowed by
    Access-Control-Allow-Headers in preflight response.</p>
  </blockquote>
  
  <p>The custom CORS header in my theme function is as follows, </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>function my_customize_rest_cors() {
    remove_filter( 'rest_pre_serve_request', 'rest_send_cors_headers' );
    add_filter( 'rest_pre_serve_request', function( $value ) {
      header( 'Access-Control-Allow-Origin: *' );
      header( 'Access-Control-Allow-Methods: GET' );
      header( 'Access-Control-Allow-Credentials: true' );
      header( 'Access-Control-Expose-Headers: Link', false );
      return $value;
    } );
  }
  add_action( 'rest_api_init', 'my_customize_rest_cors', 15 );</code></pre>
  </div>
  </div>
  </p>
  
  <p>and on my Ionic app, the code to call the API content is as follows,</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>getContact() {
      var service = this;
      let url = service.appConfig.Shop_URL + "/wp-json/erp/v1/crm/contacts";
      url = this.initUrl(url, '');
      var headers = new Headers();
      headers.append('Authorization', 'Bearer ' + service.userService.token);
      headers.append('Access-Control-Allow-Origin', '*');
      return new Promise(function (resolve, reject) {
        service.http.get(url, { headers: headers }).pipe(map(res =&gt; res.json())).subscribe(data =&gt; {
          if (data) {
            service.cachedData = data;
            resolve(service.cachedData);
          }
          else {
            reject();
          }
        });
      });
    }</code></pre>
  </div>
  </div>
  </p>
  
  <p>What did I miss that cause the CORS blocking? Thanks in advance.</p>