CODEWITHSUNDEEP
javascriptajaxcors
Casey Rodarmor
Casey Rodarmor

Reputation: 15578

AJAX request failing even though CORS headers are present

An AJAX request from a locally served page to a remote server is failing, even though it appears that CORS headers are all present. This is the javascript:

$.ajax({url: 'http://prox.tum.lt/420663719182/test-upload?Action=SendMessage&Version=2012-11-05&MessageBody=eyJlbWFpbCI6IiIsInNhbHQiOiJ6eTVzbnV0ams5MWY5YTRpIn0%3D', headers: {"X-Endpoint": "http://sqs.us-east-1.amazonaws.com"}})

And this is a curl command line that does the same thing:

curl -vH 'X-Endpoint: http://sqs.us-east-1.amazonaws.com' 'http://prox.tum.lt/420663719182/test-upload?Action=SendMessage&Version=2012-11-05&MessageBody=eyJlbWFpbCI6IiIsInNhbHQiOiJ6MTc3ZHk4cDUyaXlzeXZpIn0%3D'

If you run the above command, you can see the response CORS headers are maximally permissive:

< HTTP/1.1 200 OK
< Access-Control-Allow-Credentials: true
< Access-Control-Allow-Headers: DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,X-Endpoint,Accept,Origin,Referer,X-Something
< Access-Control-Allow-Methods: GET, POST, OPTIONS
< Access-Control-Allow-Origin: *

Here are the headers sent along with the request:

Request Headersview source
Accept: */*
Origin: http://localhost:3000
Referer: http://localhost:3000/upload
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.71 Safari/537.36
X-Endpoint: http://sqs.us-east-1.amazonaws.com

However, I'm still seeing the request fail in the network console of chrome:

XMLHttpRequest cannot load http://prox.tum.lt/420663719182/test-upload?Action=SendMessage&Version=2012-11-05&MessageBody=eyJlbWFpbCI6IiIsInNhbHQiOiJ6eTVzbnV0ams5MWY5YTRpIn0%3D. Origin http://localhost:3000 is not allowed by Access-Control-Allow-Origin.

Shouldn't the Access-Control-Allow-Origin: * header get the browser to allow this through?

I'm also seeing a preflight request in the network console, which appears to be succeeding with a 204, and the same permissive CORS headers as above. Here's a screenshot of the preflight request and response headers:

https://i.sstatic.net/YBPLV.png

Upvotes: 2

Views: 4121

Answers (2)

Brock Allen
Brock Allen

Reputation: 7435

If you're using Access-Control-Allow-Credentials, then you can't use "*" for Access-Control-Allow-Origins -- it needs to be specified as the specific origin.

Upvotes: 0

jesal
jesal

Reputation: 7958

I see you are using Chrome which is known to not play well with localhost CORS requests. Try using a domain like vcap.me (which points to 127.0.0.1) or start chrome with --disable-web-security flag.

Upvotes: 1

Related Questions