I have a facebook iframe application that makes a cross domain request to my server and requests data in JSONP format. This is my client side code:
jQuery.ajax({
url: '***',
type: 'post',
data: {
method: 'set_user_prizes'
},
dataType: 'jsonp',
jsonp: false,
jsonpCallbackString: 'callback123',
success: function(data, textStatus, jqXHR){
console.log('success_function');
console.log(data);
}
});
The problem is my success callback method isn't being invoked and I'm not sure why. Using Firebug I can see my server's response:
callback123({"success":true,"associated_prizes":[{"prizes_id":"6"},{"prizes_id":"1"}]})
JSONP has nothing to do with Ajax, since it does not use XMLHttpRequest. Instead, it dynamically inserts <script> tag into a webpage.
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.
AJAX success is a global event. Global events are triggered on the document to call any handlers who may be listening. The ajaxSuccess event is only called if the request is successful. It is essentially a type function that's called when a request proceeds.
It was proposed by Bob Ippolito in 2005. JSONP enables sharing of data bypassing same-origin policy, which disallows running JavaScript code to read media DOM elements or XMLHttpRequest data fetched from outside the page's originating site.
Remove the word String
from the callback key as is illustrated in the following transformation. The value needs to remain a string.
Change:
jsonpCallbackString: 'callback123',
to
jsonpCallback: 'callback123',
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With