Tutorial :jQuery JSONP, only works with same site URLs



Question:

I need to make a request to an API which returns json formatted data. This API is on a sub-domain of the domain this script will run off (although at the moment it's on a totally different domain for dev, localhost)

For some reason I thought that jsonp was supposed to enable this behavior, what am I missing?

Using jQuery 1.4.2

$.ajax({      url:'http://another.example.com/returnsJSON.php',      data: data,      dataType:'jsonp',      type: "POST",      error: function(r,error) {          console.log(r);          console.log(error);      },      success:function(r){      console.log(r);      }  });  


Solution:1

You'll need a combination of Arnaud's answer (don't use POST) and R. Bemrose's answer (make sure server-side returns JSONP), with the added specification of a callback function.

In other words, here's your modified request code:

function dosomething(data) {      console.log(data);  }    $.ajax({      url: 'http://another.example.com/returnsJSON.php',      data: data,      dataType: 'jsonp'  });  

Helpful to note that in the generated code you'll see that when the dataType is "jsonp", jQuery outputs a script tag pointing at the url; it's not a typical XHR. You could also use jQuery's getJSON() here.

Then your response will have to be formatted as such:

dosomething({      test: 'foo'  });  

When the call is complete, your specified callback will fire.


Solution:2

Change your type from "POST" to "GET". That is, only if you intend to retrieve data.


Solution:3

Did you modify the server-side component to use JSONP?

You can't just tell the client to use JSONP and suddenly expect a JSON script on the server-side to return the correct result.

Specifically, JSONP requires the server to return a JavaScript string that calls a specific function (whose name is passed in with the other arguments) with the return results, which the client then evals.


Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Previous
Next Post »