Monday, September 13, 2010

If you've ever done any kind of AJAX development, you're probably aware of the same-origin policy that most web browsers enforce. This policy dictates that any AJAX request made by a web page may only request data from the domain from which it was served. In other words, http://www.example.com/index.html can only make AJAX requests to any page or script on example.com or any of its subdomains. The reason for this policy is that if any external data is malicious, it would open up your web page to a host of cross-site scripting vulnerabilities.

Just recently, I decided to write a simple weather update page, using AJAX and XML data from a weather website. The problem is, I can't request my weather XML data from "www.weatherexample.com" because I'm either viewing my weather web page on my own web server, or locally on my PC.

The key to solving this problem is server-side scripting. If you have the ability to run any kind of server-side programming language where you are hosting your AJAX web page, you can get around the same-origin policy. It is possible to set up a server-side script that acts as a relay for the XML data you're trying to reach. A server-side script can go and get HTTP data from anywhere on the open web, with no restrictions. The script could then relay that data back down to your AJAX web page, provided it was the same server that served your AJAX web page in the first place. The following diagram should illustrate the concept more clearly:

So how do you get your server-side script to grab XML data for you, and pass it along back to you? The steps are as simple as obtaining the data and storing it into a variable, then printing that data with the appropriate headers. I've included two examples, one in PHP, and one in Perl.