Cross Domain Ajax Request with JQuery/PHP

Help, if you can-

The situation:

http://foobar.com includes a remotely hosted javacript file (http://boobar.com/stuff.js).

The goal is to just get an alert from the remotely hosted php script on foobar.com

I have tried the following code in stuff.js:

$.ajax({
  type: "GET",
  url: "http://www.boobar.com/script.php?callback=?",
  dataType: 'jsonp',
  success: function(result) { alert(result); }
});

No luck.

$.getJSON("http://www.boobar.com/script.php?jsonp=?",
  function(data) { alert(data); }
);

Also no luck.

On the php side I have tried both the following:

return json_encode(array(0 => 'test'));

echo json_encode(array(0 => 'test'));

In Firefox I get a security error. I understand that it thinks I'm violating the security model. However, according to the jquery documentation, I should be able to accomplish this.

The error seems to be a security feature of the Same Origin Policy: to simplify, you can only make AJAX requests for stuff on the originating server (http://foobar.com). One way around this is to make a simple facade on the originating server, e.g.:

 <?php
 // this file resides at http://foobar.com/getstuff.php
 echo file_get_contents('http://www.boobar.com/script.php?callback=?'
          . $possibly_some_other_GET_parameters );
 ?>

Then, from foobar.com, you can make an AJAX request for http://foobar.com/getstuff.php (which in turn makes a HTTP GET request from your web server to boobar.com and sends it back to the browser).

To the browser, the request goes to the origin server, and is allowed (the browser has no way of knowing that the response comes from somewhere else behind the scene).

Caveats:

• the PHP config at foobar.com must have allow_url_fopen set to "1". Although this is the default setting, some servers have it disabled.
• the request to www.boobar.com is made from foobar.com server, not from the browser. That means no cookies or user authentication data are sent to www.boobar.com, just whatever you put into the request URL ("$possibly_some_other_GET_parameters").

You can get data from another server asynchronously using script tags and json:

<script type="text/javascript" src="http://somesite.com/path/to/page/"></script>

You can use this to dynamically load a remote javascript (by created a new script element and setting the src attribute, then loading into the DOM), which could set a variable. However, you need to really trust the remote site, because the JS will be evaluated without any precondition.

There is a method called window.name transport or window.name method which uses a general browser bug(not sure if this is a bug actually). You make the request through an iFrame and the loaded page puts the information you need to the "name" property of the JavaScript window object of itself.

This method uses a "blank.htm" since it first navigates to the target page and then goes back to the blank.htm page to overcome the "same origin policy" restriction.

Dojo have implemented this and you can find a more detailed explanation here.

Also I have implemented a cross-domain XMLHttpRequest object based on this method in the library I have written which can be found here.

You may not be able to use the library since it will need 1 or 2 additional libraries which can be found here.

If you need further help in implementing it in your style, I'll try to do my best.