parse error callback function not called jquery ajax error?

Question

I have been trying all the methods that i have seen in the stack overflow asked by other users before.But none of them are working.Please hoping any of you would point me in the right direction

$.ajax({
 type: "get",
 dataType:'jsonp',
 params:jsonData,
 jsonp:false,
 jsonpCallback:"callbackfn",
 headers: { "api_key": "u5FocU4xLq2rBfZ1ZSV8o81R2usYzUEM3NaCinnV"},
  url: "http://localhost/url?name=xxx&[email protected]",
 success:function(){
  alert("sucess function");
   },
  error: function(jqXHR, textStatus, errorThrown){
       alert(textStatus + " and<br> " + errorThrown);
    }
  });
 function callbackfn(data) {
   alert(data);
  }

the response is { "firstName":"John", "lastName":"Doe" }

Although the response is json,this rises an error

Parse error .callbackfn not called.

Javascript implements hoisting, so moving the function deceleration wouldn't change anything @devlincarnate — citysurrounded
– citysurrounded, Commented Oct 3, 2016 at 21:14
@citysurrounded yes.exactly.and do you know why this error is arising? — kevin
– kevin, Commented Oct 3, 2016 at 21:15
Perhaps because the response from the service is not valid JSON (hence the parse error) — Rob M.
– Rob M., Commented Oct 3, 2016 at 21:16
@kevin take a look at this post here: stackoverflow.com/questions/37436728/… describing how to accommodate jsonp callbacks in a lambda function on AWS. Is this at all helpful? I don't think your server is set up properly to handle jsonp. — citysurrounded
– citysurrounded, Commented Oct 3, 2016 at 22:02

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

In order to use a custom callback function with JSONP, you must declare its scope to be global, i.e.

window.callbackfn = function(data) {
    alert(data);
};

Why?

This is because successful JSONP responses return a new JavaScript file, that is, a JavaScript function call encapsulated in <script> tags. Since each script is independently evaluated in the global scope, any script's function you would like to be made available to another script must also be declared in the global scope. Thus all JSONP callback functions should be global.

EDIT

According to OP, the solution found here: Return JSONP via AWS Lambda/API Gateway did the trick. Issue had to do with an improper server-side JSONP response.

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Oct 3, 2016 at 22:23

citysurrounded

6744 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Rob M. · Accepted Answer · 2016-10-03 21:34:05Z

0

Make sure that your response from the server is a function call with the response data as the argument. It appears you are just outputting JSON, but JSONP expects a function call with the response data. Your server response should look like this:

callbackfn({
  "firstName":"John",
  "lastName":"Doe"
});

You have jsonp: false with a jsonpCallback and dataType: 'jsonp' - which is odd, because you are also supplying a jsonp callback. Perhaps if you don't need JSONP due to cross-origin requests, you should remove the jsonpCallback argument and just manually call that function with the response:

$.ajax({
   type: "get",
   dataType:'json',
   params:jsonData,
   headers: { "api_key": "u5FocU4xLq2rBfZ1ZSV8o81R2usYzUEM3NaCinnV"},
   url: "http://localhost/url?name=xxx&[email protected]",
   success:function(data){
     callbackfn(data);
   },
   error: function(jqXHR, textStatus, errorThrown){
       alert(textStatus + " and<br> " + errorThrown);
    }
});

edited Oct 3, 2016 at 21:34

answered Oct 3, 2016 at 21:26

Rob M.

36.6k6 gold badges56 silver badges51 bronze badges

7 Comments

kevin Over a year ago

M how can i check that?

Rob M. Over a year ago

I don't follow, you posted that the response is a plain JS object { "firstName":"John", "lastName":"Doe" }, but JSONP responses must be the object wrapped in a function call to the supplied function name (jsonpCallback=callbackfn) - therefore the server response must be what I posted in my answer.

kevin Over a year ago

No.the response was like the code I have pasted in the question.so,is there any other mistake I was doing?

Rob M. Over a year ago

The mistake is that you are serving an improper response and either A) Cannot use JSONP with this backend or B) Need to alter the backend to serve the response in the format I posted. Please see stackoverflow.com/questions/3839966/… for how JSONP works

kevin Over a year ago

but if i do that there is cross origin request problem.thats why i am using jsonp

|

Collectives™ on Stack Overflow

parse error callback function not called jquery ajax error?

2 Answers 2

Why?

EDIT

Comments

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Why?

EDIT

Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related