CORS Access-Control-Allow-Origin despite the correct headers

Question

I am trying to configure simple shared access to Cross-Origin resources using jQuery (1.7.1) with ajax support on the client, and apache on the python server (django). According to all the instructions I read, my headers are configured correctly, but I keep getting the following error:

XMLHttpRequest cannot load http://myexternaldomain.com/get_data . The origin of http: // localhost: 8080 is not allowed by Access-Control-Allow-Origin.

The header I'm trying (I'm not sure if it even bypassed the browser) sends:

Request URL:http://myexternaldomain.com/get_data Accept:application/json, text/javascript, */*; q=0.01 Origin:http://localhost:8080 Referer:http://localhost:8080/static/js/test-zetta.html User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_6_8) AppleWebKit/535.11 (KHTML, like Gecko) Chrome/17.0.963.66 Safari/535.11 

Javascript code

  var request = $.ajax({ url : "http://myexternaldomain.com/get_data", type : "POST", dataType : "json", crossDomain : true }); 

Note that origin is set correctly. The server adds an Access-Control-Allow-Origin = * header using the following python code

 def process_response(self, response): if response.has_header('Access-Control-Allow-Origin'): return response response['Access-Control-Allow-Origin'] = '*' return response def get_orders(request): """ Tell worker what to do """ response_data = {} response_data['action'] = 'probe' response = process_response(HttpResponse(json.dumps(response_data), mimetype="application/json")) return response 

If I visit the address directly, it seems to confirm the header is set correctly

 Access-Control-Allow-Origin:* Content-Type:application/json Date:Thu, 08 Mar 2012 05:06:25 GMT Server:Apache/2.2.20 (Ubuntu) Transfer-Encoding:chunked 

However, it always fails in setting up the cross-domain (I tried both chrome and firefox). I tried to implement the code exactly according to the selected answer to this question, but get the same error

Update

I am sure the problem is with the server since I managed to get my ajax calls to work with another open CORS server. When I compare the headers returned from this public server and those returned from mine (when I test from the same domain), I see no significant difference that could account for the difference (see below).

One subtlety that I excluded, which may or may be important, is that the actual domain is the amazon domain of several subdomains. the real address is http://ec2-23-20-27-108.compute-1.amazonaws.com/get_orders , feel free to research it to see what I'm doing wrong. p>

From a shared server

 Access-Control-Allow-Origin:* Connection:Keep-Alive Content-Encoding:gzip Content-Length:622 Content-Type:text/html Date:Thu, 08 Mar 2012 15:33:20 GMT Keep-Alive:timeout=15, max=99 Server:Apache/2.2.14 (Ubuntu) Vary:Accept-Encoding X-Powered-By:Perl/5.8.7, PHP/4.4.0 

From my server - (cross domain does not work)

 Access-Control-Allow-Origin:* Content-Encoding:gzip Content-Type:text/plain Date:Thu, 08 Mar 2012 15:32:24 GMT Server:Apache/2.2.20 (Ubuntu) Transfer-Encoding:chunked Vary:Accept-Encoding 

Answer 1

So, I was misled by the answer from going to the URL, and in fact the problem was that when I executed the ajax request, I got a 403 error (only in firefox not chrome) due to csrf protection.

Answer 2

You need to do a “preliminary” request and response because your situation is considered “ not so simple . Basic CORS, which requires only an Origin header, can only have content types“ application / x-www-form-urlencoded ”,“ multipart / form-data "and" text / plain ". Since you return" application / json ", you are not meeting this requirement.

I don't know anything about Django, but it was easier for me to implement CORS support outside of my application using the Tomcat filter . It looks like you can do the same with Django.

2013-08-11: It seems that the GitHub repo no longer works with us. But the Django package is still available at https://pypi.python.org/pypi/django-cors/0.1

Answer 3

I used the excellent django-cors-headers library and ran into this problem. For me, the solution was to add "accept-encoding" to the default CORS_ALLOW_HEADERS tuple.