CORS working in Chrome v36 not working in Chrome v37
I spent several days trying to figure out why my CORS apps suddenly started failing in Chrome when I upgraded from Chrome v36.xxx to v37.yyy (specifically 37.0.2062.103). In my application, I am running an MVC and WebAPI site on a different port. This is where cross domain gets into things.
I have multiple instances (dev, uat, prod) that act the same way. Everyone is used to work.
XMLHttpRequest cannot load http: // "mywebapihost": "mywebapiport" / api / v 1.0 / myapp /. none The Access-Control-Allow-Origin header is present on the requested resource. The origin 'http: // "mymvchost"' is therefore not allowed.
There seems to be an issue with the OPTIONS request in preflight lighting, which I have mentioned many times on the internet.
However - I don't feel close to "fixing" my problem (where "fixing" == might work in Chrome).
Things I can point out about my system:
(1) Always worked with v36.xxx, but not with update 37.0.2062.103 (2) Works in IE (3) Works for GET even in latest Chrome (4) Works even in latest Chrome. if I have Fiddler running (I don't consider this a fix!)
What I have tried.
1) Force jQuery Ajax caller headers to try to get authorization in OPTIONS call - suggestions from internet
beforeSend: function (xhr) {
xhr.setRequestHeader('Authorization', make_base_auth("<username>", "<password>"));
},
headers: {
"Authorization": "Basic " + btoa("<username>" + ":" + "<password>")
}
2) I downloaded Chrome Canary v39.0.2150.3 hoping this problem goes away - still getting the same errors.
If anyone has any suggestions I would be very grateful, I need to switch to IE to make progress!
source to share
For the sake of closure, I answer my own question here. It might help someone in the future.
What I did was create a completely clean, minimal working WebAPI project that implemented GET, PUT, POST and DELETE. I got this working as expected and then tried cross domain (same server, but the webpage with JS Ajax was on port 80 and WebAPI was running on port 7694).
This failed, predictably. So I have enabled CORS with the required nuget package, added
config.EnableCors();
in WebApiConfigcs.
In my minimal WebAPI controller, I added
[EnableCors(origins: "*", headers: "*", methods: "*", SupportsCredentials = true)]
It all worked as intended.
However, when I installed the same controller, etc. into my existing, unsuccessful WebAPI deployment, it didn't go the way it caused my original question.
So it had a config smell.
It turned out to be fixed by clearing the configuration of my IIS Server and the WebAPI project I was deploying. I got stuck on both too much, trying to make the pre-flight request OPTIONS work.
Specificall, in Web.Config I added
<system.web>
....
....
<!--<authentication mode="Windows" />-->
<authorization>
<deny users="?" />
<allow verbs="OPTIONS" users="?" />
</authorization>
</system.web>
AND
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />
</customHeaders>
</httpProtocol>
With the following suggestions presented on the Internet.
I removed both of them and everything started working.
I appreciate that this is a bit of a fuzzy answer, but it might save someone from the frustration I have had for several days.
Chris
source to share
I have the same problem. I just updated to Chrome 38 (38.0.2125.101m) and the issue persists. As suggested below, I deleted my answer here and created a new question: Chrome v37 / 38 CORS error (again) with 401 for pre-flight OPTIONS requests .
As you will see in this question, my Angular app is sending explicit withCredentials
, so the server must properly authenticate the requested OPTIONS request.
source to share