Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JSON: How do I make cross-domain JSON call

I try to run the following jquery code in local Network.

 $.ajax({
     type: "GET",
     url: "http://SomeSite/MyUrl/",
     cache: false,
     data: { ... },
     dataType: "json",

     error: function (xhr, status, error) {
                                    ... 
     },
     success: function (json) {
                                    ...
     });

Everything works fine until "SomeSite" is localhost. I mean the same server from what the page was downloaded.

But when 'SomeSite' is another (not localhost) network site it looks like request hangs. Not "error", nor "success" callback functions are called. How can I make this code work?

Thank you in advance!

like image 987
Andrew Florko Avatar asked Apr 05 '11 08:04

Andrew Florko


People also ask

How do I create a JSONP request?

Method to use JSONP:In HTML code, include the script tag. The source of this script tag will be the URL from where the data to be retrieve. The web services allow to specify a callback function. In the URL include the callback parameter in the end.

Does JSONP still work?

JSONP is still useful for older browser support, but given the security implications, unless you have no choice CORS is the better choice.

What is difference between JSON and JSONP?

JSONP stands for JSON with Padding. Requesting a file from another domain can cause problems, due to cross-domain policy. Requesting an external script from another domain does not have this problem. JSONP uses this advantage, and request files using the script tag instead of the XMLHttpRequest object.


3 Answers

I had a similar issue. I tried the proxy script quoted by Symba but for some reason it could not work on my machine. In my case I was trying to send request to an app hosted on a JBoss AS on the same host. Somehow the version of JBoss I had did not have a way to modify response headers so that I could include "Access-Control-Allow-Origin", "*".

I solved it by using Symba's approach above but instead of Ben Alman's script I just set up a reverse proxy on my Apache Server, see https://www.simplified.guide/apache/configure-reverse-proxy . By defaults Apache would still have cross domain issues. By setting the response header "Access-Control-Allow-Origin", "*", see http://enable-cors.org/server_apache.html, the problem goes away.

like image 196
George Sibiya Avatar answered Oct 06 '22 00:10

George Sibiya


Do you have server access to 'SomeSite', or is it 3rd party?

  • If you have access you can enable CORS wp, home on it. In its simplest form (data is not session sensitive), just add the header: Access-Control-Allow-Origin: *

  • If you don't have access do you know whether it supports JSONP wp, so? This typically involves passing at least a callback parameter in the URL. (Of course if you have access you can add JSONP support too.)

  • If you don't have access to make changes to 'SomeSite' and it supports neither CORS nor JSONP, you might be able to use YQL wp, home as a proxy. It does support both CORS and JSONP and can even translate data formats, select some part of the data, etc.
    (Note that YQL respects robots.txt so if it's a 3rd party site that restricts automated access you might still be out of luck.)

like image 33
hippietrail Avatar answered Oct 05 '22 23:10

hippietrail


I had the same issue. Trying to get json from a server to wich I dind't had access (=> no JSONP).

I found http://benalman.com/projects/php-simple-proxy/ Add the php proxy to your server and do the ajax call to this file.
"Any GET parameters to be passed through to the remote URL resource must be urlencoded in this parameter."

$.ajax({
   type: 'GET',
   url:'proxy.php?url=http://anyDomain.com?someid=thispage',
   dataType: "json",
   success: function(data){
      // success_fn(data);
   },
   error: function(jqXHR, textStatus, errorThrown) {
      // error_fn(jqXHR, textStatus, errorThrown);
   }
});

where proxy.php (the file from Ben Alman) is hosted in your domain



Alternative (which I found to be second best to this):
http://james.padolsey.com/javascript/cross-domain-requests-with-jquery/
like image 26
Claudiu Avatar answered Oct 05 '22 23:10

Claudiu