HTML5, CSS3, jQuery, JSON, Responsive Design...

Get AJAX data from *any* server... revisited

Michael Brown   March 3 2012 08:37:26 PM
Ajax makes web apps live and breathe, but it has a major restriction: you can only retrieve data from the same server on which you own code resides.  You can get around such a limitation by using, JSONP but that has limitations; I found that it didn't work well where an authentication key needed to passed to the Ajax service, for example.  

I recently discovered that it is actually possible on the Google Chrome browser to turn this same origin restriction off, so really allowing your Ajax call to fetch data from any server.  All you have to do is launch Chrome with a certain switch at the command line.  Here's how to do it.  (File paths may vary for your own OS, of course.)

On Mac OS X
open "/Applications/Google Chrome.app" --args --disable-web-security -–allow-file-access-from-files



On Windows 7
C:\Users\AppData\Local\Google\Chrome\Application\chrome.exe  --disable-web-security  --allow-file-access-from-files


On Linux
/usr/bin/chromium-browser --disable-web-security   --allow-file-access-from-files


Obviously, this is not suitable for a production environment; you can't go around changing how your customers/users launch their browser, even assuming that they're all using Chrome in the first place!  But for testing, it's a godsend.  You can test against production URLs from a test server, knowing that it will all work (you hope!) when the code is actually moved to that target server itself.

I'm also finding it useful for testing mobile web apps for PhoneGap.  Mobile web apps, unlike web apps that run inside a browser such as Mobile Safari, are not subject to the same origin policy.  After all, the mobile web app files are not actually on a server; they're sitting on your mobile phone or tablet.  Being able to simulate this environment in a full desktop browser before testing it on a phone simulator is great, because PhoneGap's debugging features are limited, to put it mildly.  It makes sense that it's fully debugged, as far as possible, as a desktop web app before you go mobile with it.  I say "as far as possible", because there are some mobile web app features that are not easy to simulate on a desktop browser, e.g. location services, accelerometers etc.
Comments

1Andrew Pollack  03/03/2012 11:46:27 AM  Get AJAX data from *any* server... revisited

Note to self: Add this to the very top of my list of ways NOT to surf the internet.

2Michael Brown  03/03/2012 7:11:00 PM  Get AJAX data from *any* server... revisited

Quite so, Andrew.

As I said, it's great for testing. I wouldn't advocate running it as a general web browser. In fact, I've not even bothered setting up a shortcut/alias to run it this way; I make myself type it out in the command line every time. That way, there's no danger of running it by accident.

Cheers,

- Mike

3Rami  03/04/2012 7:16:23 AM  Get AJAX data from *any* server... revisited

Nice tip for a web developer who needs to debug and work/develop in console.

thanks!

So I assume once you close the browser the property goes away?

4Michael Brown  03/04/2012 1:52:56 PM  Get AJAX data from *any* server... revisited

Close down the browser, then start it again normally - i.e. without the command line switches - and the same origin policy is back in place.

About