HTTP preflight (OPTIONS) request fails in IE only

问题:

I trying to make a POST request to my REST API. Here is the code snippet (using AngularJS):

        $http({
            method: 'POST',
            url: url,
            data: reqBody,
            headers: {
                'content-type': 'application/json'
            }
        })
        .then(function (response) {...})
        .catch(function (error) {...});

According to this article, because of the HTTP header

'content-type': 'application/json'

browser concludes that it will have to make an "not-simple" HTTP request which requires handshake with a server (HTTP options request will be sent before actual HTTP request).

Chrome handles the request like a charm, but IE (11 in my case) fails with the following messages:

The thing is, HTTP options response contains everything the browser needs to proceed with the actual HTTP request.

回答1:

You could add sites to Trusted zone in IE settings and set "Access data sources across domains" to Enable (not Prompt):

It works not only for IE 9, but 10+ as well.

More on this: https://www.webdavsystem.com/ajax/programming/cross_origin_requests

回答2:

I found the reason for all that mess.

The API service and the website were located on the same domain, but on different ports. To be specific, the API service was located on:

myDomain.com/apiService

and the website was located on:

myDomain.com:44443/webSite

Thus, when the web browser was initializing the call from:

myDomain.com:44443/webSite/page1

to:

myDomain.com/apiService/service1

Internet Explorer was blocking the call because of the CORS. For some reason, Chrome was less strict in that matter, because it succeeded to make the call to the API.

To make it work in Internet Explorer, I moved the website to the same port as the API:

myDomain.com/apiService

myDomain.com/webSite