CORS POST Requests not working - OPTIONS (Bad Request) - The origin is not allowed

Ok I got past this. This has got to be the strangest issue I've ever encountered. Here's how to "solve" it:

1. Continue on with life as usual until suddenly out of no where OPTIONS requests to this domain begin returning 200 OK (instead of 400 Bad Request) and POST never happens (or at least seems like it doesn't because the browser swallows it)
2. Realize that Fiddler's OPTIONS response mysteriously contains duplicates for "Access-Control-Allow-XXX".
3. Try removing the following statement from you web.config even though you clearly remember trying that to fix the previous issue and it not working:

Remove this:

    <httpProtocol>       <customHeaders>         <remove name="X-Powered-By" />         <add name="Access-Control-Allow-Origin" value="http://mydomain.com" />         <add name="Access-Control-Allow-Headers" value="Accept, Content-Type, Origin" />         <add name="Access-Control-Allow-Methods" value="GET, PUT, POST, DELETE, OPTIONS" />       </customHeaders>    </httpProtocol>

Because you already have this:

 var enableCorsAttribute = new EnableCorsAttribute("http://mydomain.com",                                                   "Origin, Content-Type, Accept",                                                   "GET, PUT, POST, DELETE, OPTIONS");        config.EnableCors(enableCorsAttribute);

Moral: You only need one.

if you use OAuth Authorization . request not go direct to web api. You need to enable OWIN CORS support for that endpoint.

How i do on my site:Install owin cors

Install-Package Microsoft.Owin.Cors

Note: please not use : Install-Package Microsoft.AspNet.WebApi.Cors

In file Startup.Auth.cs

 //add this line            app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);            // Enable the application to use bearer tokens to authenticate users            app.UseOAuthBearerTokens(OAuthOptions);

I have an MVC controller (not an ApiController) but the solution I came up with may help others. To allow cross domain access to a POST action (/data/xlsx) on the controller I implemented 2 actions:

1. for the pre-flight check
2. for the post

If you don't have the HttpOptions action then you get 404's on the pre-flight check.

Code:

[HttpOptions]public ActionResult Xlsx(){    // Catches and authorises pre-flight requests for /data/xlsx from remote domains    Response.AddHeader("Access-Control-Allow-Origin", "*");    Response.AddHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");    Response.AddHeader("Access-Control-Allow-Methods", "GET, PUT, POST, DELETE, OPTIONS");    return null;}[HttpPost]public ActionResult Xlsx(string data, string name){    Xlsx(); // Add CORS headers    /* ... implementation here ... */}

I've tested it in IE 11, Chrome, FireFox.