request content on another domain/server

Question

I'm trying to request data which is located on another domain/server, but I'm getting an exception when I try to send the request.

var request = new XMLHttpRequest();
request.open("GET", "http://www.w3schools.com/ajax/cd_catalog.xml", false);
request.send();

The error:

uncaught exception: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE)" nsresult: "0x80004005 (NS_ERROR_FAILURE)"]

Is this the correct way to request content which isn't on the same domain/server? Or is there some other way to accomplish this?

I'm testing this in firefox 8.0, but I'd like a solution that could work for all major modern browsers.

Answer 1

For security reasons, a request like this won't work. Imagine if any domain could access any other domain's data - you'd end up with any site (e.g. www.sketchyattacksite.com) being able to pull arbitrary content from any other site (e.g. www.bankofamerica.com), including an authenticated user's confidential session information. The same origin policy, implemented by all modern browsers, exists to prevent such security violations from occurring.

There are a few common ways to get around the same origin policy:

1. The domain you're requesting data from can return said data as JSONP (which lets you load it as if it were an external script, not subject to the same origin policy). Often sites will provide a JSONP format in their APIs, for example: https://graph.facebook.com/cocacola?callback=name_of_function_to_pass_data_via_jsonp
2. Cross-Origin Resource Sharing (CORS) is a recent standard so will only work in newer browsers, but allows sites to specify (via an HTTP header) which domains they will allow to access their data. For example, if Bank of America for some reason wanted to allow www.sketchyattacksite.com to make requests to www.bankofamerica.com, they could return an Access-Control-Allow-Origin: sketchyattacksite.com header.
3. A serverside proxy. You can create a handler on your server, the sole function of which is to retrieve your target http://www.w3schools.com/ajax/cd_catalog.xml file and return it on your domain. Note that this solves the problem of confidential data potentially being passed, because instead of the users' browser making the request, your server (which does not have access to the user's cookies on w3schools.com) does.

In this particular case it looks like #3, a serverside proxy, is the answer. Why? Because you don't have control of the site you're requesting the data from (meaning you can't take advantage of #1 or #2 unless the w3schools.com has itself chosen to implement them).

Here's a simple PHP example of a serverside proxy, courtesy of Yahoo!. The key is that it is locked down to only pull in content from specific domains (so that bad actors can't use it for arbitrary requests that appear to be made on your behalf), beyond that it's as simple as requesting the target URL via curl and returning it to the user. Note that you might also want to add caching to prevent every load of your serverside proxy from triggering a new request for the http://www.w3schools.com/ajax/cd_catalog.xml file.

Answer 2

You can't retrieve content from another domain directly. You can retrieve content via a server doing the job for you (proxy), or using something like JSONP. Check this wikipedia page.

For extra information on the subject, this page may be interesting

Answer 3

This is called Cross-Domain Ajax most browsers consider this a security violation. One workaround is to create a server side component (the same domain as the page you are viewing) that will request the data from the other server (/www.w3schools.com in your case) and echo that back to your Ajax request.

these links will explain the problem and several solutions:

http://jimbojw.com/wiki/index.php?title=Introduction_to_Cross-Domain_Ajaxrequest

http://usejquery.com/posts/the-jquery-cross-domain-ajax-guide

Answer 4

its a cross domain request ,It always performed using a proxy on the server. You create a server request and call http://www.w3schools.com/ajax/cd_catalog.xml on that page like abc.apsx and call your own abc.aspx using the javascript

var request = new XMLHttpRequest();
request.open("GET", "abc.aspx");
request.send();