title: Woocommerce-api CORS error in ionic angular
body: <p>I am stuck in this place for several days.
  I googled for countless times and couldn't find the answer.
  I am just making a simple ionic application that gets the products from my wordpress website.
  When I try 'ionic serve' in terminal, I get the following error.</p>
  
  <pre><code>Access to fetch at 'http://axx.nwh.mybluehost.me/WooIonic/wc-api/wc/v3/products?oauth_consumer_key=ck_1085532f8447ad05f7a77766ba54c62b131edcb6&amp;oauth_nonce=bXnOUgfqbVJyVl4fPTwcwxV7cKVX9Ldx&amp;oauth_signature_method=HMAC-SHA256&amp;oauth_timestamp=1591298066&amp;oauth_version=1.0&amp;oauth_signature=39bmDp8bPyXeRRk7M62Wz%2Fjkbk35N%2F4XJ3jnarY1QlM%3D' from origin 'http://localhost:8100' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
  </code></pre>
  
  <p>I have already installed woocommerce-api and my source code is as follows:</p>
  
  <pre><code>import WooCommerceRestApi from 'woocommerce-api';
  export class HomePage implements OnInit {
     WooCommerce: any;
  
     constructor() {
         this.WooCommerce = new WooCommerceRestApi({
             url: 'http://axx.nwh.mybluehost.me/WooIonic',
             consumerKey: 'ck_xxxxxxxxxxxxxxxxxxxxx',
             consumerSecret: 'cs_xxxxxxxxxxxxxxxxxxxxx',
             version: 'wc/v3'
         });
         this.WooCommerce.getAsync('products').then((data) =&gt; {
             console.log(data);
         }, (err) =&gt; {
         console.log(err);
         });
      }
      ngOnInit() { }
   }
  </code></pre>
  
  <p>I looked up on google and found some answers saying about disabling web security on chrome or adding hooks in functions.php of the theme but it turns out that none of them works in my case.
  Below is the code that I added in functions.php of storefront theme of my website.</p>
  
  <pre><code>function add_cors_http_header(){
      header("Access-Control-Allow-Origin: http://localhost:8100");
      header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS, READ');
      header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token, authorization, 
            XMLHttpRequest, user-agent, accept');
      header("Access-Control-Allow-Credentials: true");
  
      if ( 'OPTIONS' == $_SERVER['REQUEST_METHOD'] ) {
          status_header(200);
          exit();
     }
  }
  add_action('init','add_cors_http_header');
  
  add_filter('kses_allowed_protocols', function($protocols) {
      $protocols[] = 'ionic';
      return $protocols;
  });
  </code></pre>
  
  <p>Can anyone please help me on this matter?
  I really need your help and I will be very grateful for any kind of answer.
  Just in case, I have the latest versions of ionic, wordpress(bluehost) and woocommerce.
  I will be looking forward to your answers.
  Best regards.
  LongMa Lin</p>