title: Angular HttpClient Response to preflight request doesn't pass access control check: It does not have HTTP ok status
body: <p>I am attempting to use HttpClient to get a json return from a file that I have locked using htaccess and htpasswd on my web server. I can run the get/post request on postman with the Authorization header and it returns fine. When I run it in angular, I get the error in the title along with a 401 error.</p>
  
  <p>Here is the function that triggers the HttpRequest</p>
  
  <pre class="lang-js prettyprint-override"><code>  getConfig(): Observable&lt;any&gt; {
      return this.http.get('myurlhere/myfile.json', { responseType: 'json' })
    }
  </code></pre>
  
  <p>Here is my interceptor - and yes, the console.log fires and logging the result shows the the request with the headers appended.</p>
  
  <pre class="lang-js prettyprint-override"><code>import { Injectable } from '@angular/core';
  import {
    HttpRequest,
    HttpHandler,
    HttpEvent,
    HttpInterceptor
  } from '@angular/common/http';
  import { Observable } from 'rxjs';
  
  @Injectable()
  export class AuthInterceptor implements HttpInterceptor {
  
    constructor() { }
  
    intercept(req: HttpRequest&lt;any&gt;, next: HttpHandler): Observable&lt;HttpEvent&lt;any&gt;&gt; {
      req = req.clone({
        setHeaders: {
          'Authorization': 'Basic XXXXXXXXXXXXXXXXXXXXXXX'
        }
      })
      console.log('INTERCEPTED')
      return next.handle(req);
    }
  }
  
  </code></pre>
  
  <p>There are a lot of similar issues here, but nothing seems to be working. The 401 return is labeled OPTIONS and I've pieced together what that means, just can't find a way around it.</p>