6

I'm trying to upload files to a service on a different domain using CORS, but they keep failing due to the origin being denied. As far as I can see the correct headers are being used to allow this.

Javascript request:

  var xhr = new XMLHttpRequest();
  xhr.open('POST', "https://files.example.com", true);                                                                                                                            
  xhr.setRequestHeader('Content-Type', 'application/json');
  xhr.onreadystatechange = function () {
    if (this.status == 200 && this.readyState == 4) {
      console.log('response: ' + this.responseText);
    }
  };

  xhr.send();

Response from the preflight OPTIONS request:

Access-Control-Allow-Headers:Origin, Authorization, Content-Type
Access-Control-Allow-Methods:POST, OPTIONS
Access-Control-Allow-Origin:*
Content-Length:0
Content-Type:application/json
Date:Mon, 19 Nov 2012 23:30:21 GMT

Headers for POST request:

Cache-Control:no-cache
Content-Type:application/json
Origin:https://www.example.com
Pragma:no-cache
Referer:https://www.example.com
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_0) AppleWebKit/537.19 (KHTML, like     Gecko) Chrome/25.0.1325.0 Safari/537.19

Which results in the error:

XMLHttpRequest cannot load https://files.example.com. Origin https://www.example.com is not allowed by Access-Control-Allow-Origin.
2

4 Answers 4

2

Unfortunately, POSTing to a domain other than your page's elicits CORS. That also includes different subdomains, ports and protocol (http/https).

Preflight is done when the request is "not simple", meaning, a content-type header set to something other than "text/plain". Your "application/json" makes browsers get scared into preflighting.

If those 50-200 ms are important to you, then you can rewrite your web service to understand the "simple" content type. If not, then you should make your web service throw back HTTP status 204 (no content) when it is tasked with OPTIONS (http method).

When dealing with a wcf:

WebOperationContext.Current.OutgoingResponse.StatusCode = System.Net.HttpStatusCode.NoContent;
1

The subdomains are different. As far as CORS is concerned the subdomain, protocol and port have to be identical in the Origin and the Access-Control-Allow-Origin.

In your example it looks like the origin is: https://www.example.com and the Access-Control-Allow-Origin is: https://files.example.com

1
  • But he used Access-Control-Allow-Origin:*, which supports every origin
    – Oooogi
    Jan 5, 2016 at 13:51
0

Try adding Cache-Control and Pragma to the list of allowed headers in the preflight. The full header should look like this:

Access-Control-Allow-Headers: Cache-Control, Pragma, Origin, Authorization, Content-Type
0

It's little late, but looking at your info it shows the pre-flight CORS check works OK, it's just the actual (2nd) CORS request where the response gets blocked by the browser.

It's a pity you didn't include the response for the actual (2nd) CORS request because that might have contained the clue for the response rejection. My suspicion is that although the pre-flight response correctly contains the header:

Access-Control-Allow-Origin:*

... your actual (2nd) response might not have contained that header, in which case the browser correctly rejects the response. If my assumption is true, the solution would be to just include this header also in the actual (non pre-flight) response.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.