Geek Answers Handbook

JQuery jsonp response error - Callback was not called

I'm trying to get some information from another domain, the domain only allows jsonp calls - others get rejected. How to get content instead of execution? Because I get an error. I do not need to execute it, I just need this in the script. In any format (answer is json, but js doesn't understand it). I can’t influence this domain, so it’s impossible to change anything on this side. Here is my code:

$.ajax({ url: url + '?callback=?', crossDomain: true, type: "POST", data: {key: key}, contentType: "application/json; charset=utf-8;", async: false, dataType: 'jsonp', jsonp: 'callback', jsonpCallback: 'jsonpCallback', error: function(xhr, status, error) { console.log(status + '; ' + error); } }); window.jsonpCallback = function(response) { console.log('callback success'); };
+7
json javascript jquery jsonp
source share
3 answers

There are several problems with your call to $.ajax .

 $.ajax({ url: url + '?callback=?', // this is not needed for JSONP. What this does, is force a local // AJAX call to accessed as if it were cross domain crossDomain: true, // JSONP can only be GET type: "POST", data: {key: key}, // contentType is for the request body, it is incorrect here contentType: "application/json; charset=utf-8;", // This does not work with JSONP, nor should you be using it anyway. // It will lock up the browser async: false, dataType: 'jsonp', // This changes the parameter that jQuery will add to the URL jsonp: 'callback', // This overrides the callback value that jQuery will add to the URL // useful to help with caching // or if the URL has a hard-coded callback (you need to set jsonp: false) jsonpCallback: 'jsonpCallback', error: function(xhr, status, error) { console.log(status + '; ' + error); } });

You should name your url like this:

 $.ajax({ url: url, data: {key: key}, dataType: 'jsonp', success: function(response) { console.log('callback success'); }, error: function(xhr, status, error) { console.log(status + '; ' + error); } });

JSONP is not JSON. JSONP is actually just adding a script tag to your <head> . The response should be a JavaScript file containing a function call with JSON data as a parameter.

JSONP is what the server should support. If the server does not respond correctly, you cannot use JSONP.

Please read the docs: http://api.jquery.com/jquery.ajax/

+9
source share
 var url = "https://status.github.com/api/status.json?callback=apiStatus"; $.ajax({ url: url, dataType: 'jsonp', jsonpCallback: 'apiStatus', success: function (response) { console.log('callback success: ', response); }, error: function (xhr, status, error) { console.log(status + '; ' + error); } });

Try this code.

Also try calling this url directly in the ur browser and see what it returns exactly, thereby you can better understand what is actually happening :).

+2
source share

The jsonpCallback parameter jsonpCallback used to specify the name of the function in the JSONP response, not the name of the function in your code. You can probably remove this; jQuery will handle this automatically on your behalf.

Instead, you are looking for the success parameter (to get the response data). For example:

 $.ajax({ url: url, crossDomain: true, type: "POST", data: {key: key}, contentType: "application/json; charset=utf-8;", async: false, dataType: 'jsonp', success: function(data){ console.log('callback success'); console.log(data); } error: function(xhr, status, error) { console.log(status + '; ' + error); } });

You can also remove other JSONP-released parameters that have jQuery defaults set. See jQuery.ajax .

+1
source share

More articles:


All Articles