title: Enable CORS with WebAPI
body: <p>I am trying to get CORS to work with a new WebAPI project. The project is just the default WebAPI template (i.e. has MVC and WebAPI references) using <code>ActiveDirectoryBearerAuthentication</code>.</p>
  
  <p>Whenever I try and make a request to my API I am met with the following error:</p>
  
  <p><code>XMLHttpRequest cannot load https://localhost:44385/api/values. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://localhost:44369' is therefore not allowed access.</code></p>
  
  <p>I have installed Microsoft.Owin.Cors, and Microsoft.AspNet.WebApi.Cors.</p>
  
  <p>My WebApiConfig is this:</p>
  
  <pre><code>public static void Register(HttpConfiguration config)
  {
      config.EnableCors();
      ....
  </code></pre>
  
  <p>My Startup.Auth is this:</p>
  
  <pre><code>public void ConfigureAuth(IAppBuilder app)
  {
      app.UseCors(CorsOptions.AllowAll);
  
      app.UseWindowsAzureActiveDirectoryBearerAuthentication(
      ....
  </code></pre>
  
  <p>Solutions around the net say to add:</p>
  
  <pre><code>    &lt;customHeaders&gt;
          &lt;!-- Adding the following custom HttpHeader will help prevent CORS from stopping the Request--&gt;
          &lt;add name="Access-Control-Allow-Origin" value="*" /&gt;
      &lt;/customHeaders&gt;
  </code></pre>
  
  <p>to the web.config. However, doing this just allows everything regardless of whether <code>Microsoft.AspNet.WebApi.Cors</code> is installed, enabled, or not.</p>