同源策略规范

Question

I have a javascript AJAX call made to a code behind function running on my server, which returns to the client script (that has initiated the call), a url (from a different Domain than mine) with a query ( http://www.web_server_url.com/my_query&callback= ?). After returning the call, the following JQuery code is executed ('specific_div' being an existing div in the page):

$('#specific_div').load(returned_url);

Meanwhile, I obtain the following error message:

XMLHttpRequest cannot load http://www.web_server_url.com/my_query&callback=?. Origin http://localhost is not allowed by Access-Control-Allow-Origin.

Although I understand the same-origin policy, I do not quite understand why I am obtaining this error message in this scenario since the url is passed from my server. Shouldn't it be accepted by the browser, considering that its origin is from the same Domain (local host in this case), although it is contacting another Domain?

Answer 1

Same origin means requested resource/information must be on the same domain (schema + host + port) as page. It does not mean "url to resource provided by the origin server".

In your particular case you have page on "http://localhost" and trying to request "http://www.web_server_url.com" - scheme ("http") and port (80) match, but domain name does not ("localhost" vs. "www.web_server_url.com").

Note that error you see explains that you need to enable CORS on destination server for this particular request.

If you don't own/control destination server (and hence can't use CORS or JSONP to securely communicate with other server client side) than you most generic option is proxy that request on your server. Note that limits on what information you can use (ie you can't steal cookies set on the destination domain this way).