Access-Control-Allow-Origin header not working - What am I doing wrong?

user_1595192 0
Viewed 57473

I am attempting to provide a response to the HTTP OPTIONS method with an Access-Control-Allow-Origin header copying the contents of the Origin header in the request.

This is apparently not working, for reasons I can't figure out.

tl;dr: response from OPTIONS says:

Access-Control-Allow-Origin: http://10.0.0.105:9294

subsequent GET has:

Origin:http://10.0.0.105:9294

Chrome says:

Origin http://10.0.0.105:9294 is not allowed by Access-Control-Allow-Origin

WTF not?

More detail...

By looking in Chrome's developer tools window, the request headers are:

OPTIONS /user/kris HTTP/1.1
Host: 10.0.0.104:8080
Connection: keep-alive
Access-Control-Request-Method: GET
Origin: http://10.0.0.105:9294
User-Agent: Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.1 (KHTML, like Gecko) Chrome/21.0.1180.75 Safari/537.1
Access-Control-Request-Headers: origin, x-requested-with, content-type, accept
Accept: */*
Referer: http://10.0.0.105:9294/
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-GB,en-US;q=0.8,en;q=0.6
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3

The response headers are:

HTTP/1.0 200 OK
Date: Mon, 13 Aug 2012 11:23:45 GMT
Server: WSGIServer/0.1 Python/2.7.3
Content-Length: 0
Access-Control-Allow-Methods: GET, PUT, POST, DELETE, HEAD, OPTIONS
Access-Control-Max-Age: 10
Access-Control-Allow-Origin: http://10.0.0.105:9294
Access-Control-Allow-Headers: X-Requested-With, Authorization, X-Huzu-User, Content-Type, Accept
Content-Type: text/html; charset=UTF-8

After jQuery sends its OPTIONS request and gets the above response, 2 odd things happen. The OPTIONS response (which is a 200) shows up in the developer console as an error:

OPTIONS http://10.0.0.104:8080/user/kris 200 (OK)

After which a GET request is rejected. Error in the console:

XMLHttpRequest cannot load http://10.0.0.104:8080/user/kris. Origin http://10.0.0.105:9294 is not allowed by Access-Control-Allow-Origin.

I can't see why not. What am I doing wrong?

http-options-method cors http-headers http jquery
2 Answers

You should add Access-Control-Allow-Methods header as well along with Access-Control-Allow-Origin

For wildcard, access add below headers

   res.header("Access-Control-Allow-Origin", "*");
   res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
   res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS');

For any specific origin to be allowed, add it in place of *.

user_92664000
Related