angular 1.5 jsonp code call is not hitting the success method

Question

My jsonp code is not working using angular for some reason! I've read thousands of examples but it simply doesn't work. See my code below.

I've read this question and it hasn't resolved my problem Angularjs JSONP not working

My example code shows the http.jsonp call with the success and error methods defined. I'm using Chrome to develop and test it with for the moment and the second and third images show the ajax service call and the jsonp response from the service.

Latest update

After receiving help from @TheSharpieOne the server response is now returning an actual function (instead of a string which was the problem previously) but the success method is not executed for some reason?

    $http.jsonp(url).then(function(response) {
        alert('success');  // not hit
    }, function onError(response) {
        alert('error');  // this is displayed
    });

Many thanks,

Angular JS

var url = serviceRoot + "api/customer/get?callback=JSON_CALLBACK";

$http.jsonp(url).success(function (data) {
    alert('success');  // never called
})
.error(function () {
    alert('error');    
});

Chrome network panel

Shows chrome network panel, highlighting the ajax call

Ajax response

shows ajax response (an array of dates)

Why are you writing new APIs using JSONP when we have CORS now? — Quentin, Dec 27 '16 at 20:22
The console window is empty, no error nothing. By the way, what's CORS? Thanks, — Martin, Dec 27 '16 at 20:26
What does the URL look like (query string and all) in the network tab of devtools? — TheSharpieOne, Dec 27 '16 at 20:27
@Martin — https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS — Quentin, Dec 27 '16 at 20:29
@TheSharpieOne you can see that in my screen shot named "Shows chrome network panel, highlighting the ajax call" — Martin, Dec 27 '16 at 20:30
Since the $http .success() and .error() will be deprecated, maybe it's a good idea to use the two .then() functions principle. https://github.com/angular/angular.js/blob/master/CHANGELOG.md#http-due-to — Tome Pejoski, Dec 27 '16 at 20:34

score 0 · Accepted Answer · answered Dec 27 '16 at 20:40

0

Your JSONP response is quoted, it shouldn't be. It is supposed execute the script, which will call your callback function. Right now it is just a string, not a JavaScript function call with the parameters.

JSONP works by dropping a new <script> tag on the page linking to your URL. When it executes, it is supposed to call your callback. Thus, JSONP's response should be JavaScript and not a string.

answered Dec 27 '16 at 20:40

TheSharpieOne

25,646
9
66
78

thanks for this, it seems to work now as I've changed the ajax return to not be a string although it doesn't seem reliable? For some reason the success is not always hit. Is there a known issue or am I doing something wrong, I'm using v1.5.0-rc.2. I'm testing with the console window open and the disable cache turned on. By the way, when complete, the page will have multiple calls to different services using jsonp – Martin Dec 27 '16 at 23:38

angular 1.5 jsonp code call is not hitting the success method

1 Answers1