No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘calling URL’ is therefore not allowed access

Question

First of all let me say that I've gone through all similar posts but nothing solves my issue. I've also ruled out that the server-side is not at fault since I receive the proper response headers, at least as is shown in Fiddler and in Chrome Dev tools.

I am using Thinktecture.IdentityModel and did authentication on the client side using jquery like this:

    $.ajax({
        url: tokenEndpoint,
        type: 'GET',
        // jsonp is not an option and it does not work anyway with my server setup
        dataType: "json", // including this does not help
        crossDomain: true, // including this does not help
        beforeSend: function (xhr) {
            xhr.setRequestHeader('Authorization', 'Basic xxxxx');
        },
        success: function () {
            alert('success!');
        },
        error: function(xhr, errorType, exception) {
        }
    });

Here's the trace that I got:

* preflight CORS request *

OPTIONS http://HOST_DOMAIN/tokenEndPoint HTTP/1.1
Host: HOST_DOMAIN
Connection: keep-alive
Access-Control-Request-Method: GET
Origin: http://ORIGIN_DOMAIN
Access-Control-Request-Headers: accept, authorization
Accept: */*
Referer: http://ORIGIN_DOMAIN/login
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8

preflight response

HTTP/1.1 200 OK
Cache-Control: no-cache
Pragma: no-cache
Content-Type: application/json; charset=utf-8
Expires: -1
Server: Microsoft-IIS/8.0
Access-Control-Allow-Origin: http://ORIGIN_DOMAIN
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: accept,authorization
Content-Length: 15

{"status":"ok"}

actual AJAX request

GET http://HOST_DOMAIN/tokenEndPoint HTTP/1.1
Host: HOST_DOMAIN
Connection: keep-alive
Accept: */*
Origin: http://ORIGIN_DOMAIN
Authorization: Basic xxxxx
Referer: http://ORIGIN_DOMAIN/login
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8

AJAX response

HTTP/1.1 200 OK
Cache-Control: no-cache
Pragma: no-cache
Content-Length: 560
Content-Type: application/json; charset=utf-8
Expires: -1
Server: Microsoft-IIS/8.0
X-AspNet-Version: 4.0.30319
Set-Cookie: xxxxx


{
  "access_token": "xxxxx",
  "expires_in": xxx
}

Notice the last line of the trace, which comes from the TextView on the Fiddler tab that indicates the server call was successful. I can confirm that the server call was successful as I debugged the server-side code and the code that returns that output was reached and did not throw any errors. Any ideas how to make it work?

Answer 1

As the error message in your question title states, the response is lacking an Access-Control-Allow-Origin header. According to the response contents you posted at the end of your question, the server is not including this header. So, the issue is with your server. You'll need to include this header in your response.