Cross-Domain AJAX Request in Development

Sometimes an AJAX request on a page you’re developing needs to hit a server on a different domain. Web browsers’ Same-Origin Policy means (among other things) that other domains called from AJAX need to be whitelisted using the Access-Control-Allow-Origin header.

While this limits the damage malicious Javascript injected into a page can do, it’s annoying in development. You could whitelist your dev box, 0.0.0.0, or 127.0.0.1 (depending on how you work), but that’s ugly.

Fortunately, there’s an easier way, temporarily disable same-origin policy.

The Chrome Browsers have a command line option --disable-web-security which turns off the same-origin policy. Of course you don’t want to visit web pages out in the wild security disabled. To sandbox your browsing, launch a separate browser. For this, I use Chrome Canary Google’s “bleeding edge” version. It’s not stable enough for everyday use, but is fine for testing and different enough to remind me where I am.

Using a separate browser also means I don’t have to restart my browser and loose my 100 tabs (and getting Chrome to actually exit completely is harder than you’d think).

Once you’ve downloaded Chrome Canary simply launch via:

Mac:

open -a 'Google Chrome Canary' --args --disable-web-security

Windows:

"C:\Users\<your-user>\AppData\Local\Google\Chrome SxS\Application\chrome.exe" --disable-web-security

Linux (Installing Chrome Canary is a project beyond this post.):

/path/to/chrome-canary --disable-web-security

Once Canary launches, you should see…

…and you are good to go.