AngularJS $ http.post不适用于Chrome，仅适用于IE

Question

I am trying to post a simple JSON object to my local asp.net web.api service.

here is a peace of code.

    createTable: function (table) {
        var res = $http.post('http://localhost:50827/api/v0.1/xxxx/create-some-table', table);
        res.success(function (data, status, headers, config) {
            alert("Sent : " + JSON.stringify({ data: data }));
        });
        res.error(function (data, status, headers, config) {
            alert("failure message: " + JSON.stringify({ data: data }));
        });
    }

Asp.Net Web Api has Cors enabled and this peace of code works well with internet explorer. But Google's Chrome leaves error: OPTIONS: http://localhost:50827/api/v0.1/xxxx/create-some-table 404 (Not Found)

Same webapi controller has some other GET methods and it works well.

Any idea?

Appreciate any help.

Pavlo

Answer 1

So it seems like this is a known issue where Chrome sends a "pre-flight" request using the OPTIONS verb before sending the actual cross origin request.

There are cases when it will not send a pre-flight request, but unfortunately sending JSON is not one of those cases.

It seems like you don't have the ASP.NET WebAPI server set up to handle these types of pre-flight check requests. Probably because it is apparently not the default to enable support for it.

Luckily, there is plenty of help out there on the web to help you fix this. Here's two links to get you started.

Relevant StackOverflow question: AJAX in Chrome sending OPTIONS instead of GET/POST/PUT/DELETE?

This seems like a helpful page on how to configure CORS properly if you are using ASP.NET WebAPI 2 .

Oh, and I am assuming that if the pre-flight request fails, Chrome will not do the proper CORS request. I didn't see anywhere in my quick research to confirm or deny that, but it makes logical sense to me, since the whole point of the pre-flight request is to find out what sort of CORS requests are supported by the server, or if it is supported at all.