Angular and JSONP

81 views
Skip to first unread message

Kevin Burton

unread,
Mar 4, 2016, 11:52:18 AM3/4/16
to AngularJS
I have a request like: $http.jsonp("http://localhost:28017/...?format=jsonp&callback=JSON_CALLBACK"). Which I understand returns a promise so I have then(function(data) { ... to be called when the promise is resolved. The problem is that when I am call this I get an error 'Uncaught SyntaxError: Unexpected token :' that I notice in the debugger (Chrome) I notice that when I click on the details of this link I don't get JavaScript code but I get a JSON object that seems like the data I expect. So I am not sure what is the syntax error? Ideas?

Thank you.

András Csányi

unread,
Mar 4, 2016, 3:05:40 PM3/4/16
to ang...@googlegroups.com

- -
--  Csanyi Andras (Sayusi Ando)  -- http://sayusi.hu -- http://facebook.com/andras.csanyi
--  ""Trust in God and keep your gunpowder dry!" - Cromwell

On 4 March 2016 at 17:52, Kevin Burton <ronald.ke...@gmail.com> wrote:
I have a request like: $http.jsonp("http://localhost:28017/...?format=jsonp&callback=JSON_CALLBACK"). Which I understand returns a promise so I have then(function(data) { ... to be called when the promise is resolved. The problem is that when I am call this I get an error 'Uncaught SyntaxError: Unexpected token :' that I notice in the debugger (Chrome) I notice that when I click on the details of this link I don't get JavaScript code but I get a JSON object that seems like the data I expect. So I am not sure what is the syntax error? Ideas?

Thank you.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

Kevin Burton

unread,
Mar 4, 2016, 3:19:58 PM3/4/16
to ang...@googlegroups.com
The first link doesn't use the jsonp method. Is that the recommended way to do a JSONP request is to use GET rather than the jsonp method? If I try that then I get an error that no 'Acess-Control-Allow-Origin' header is present. It seems that the post must have some additional server side options that are not spelled out. It was a good start though.
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/QQzwdLTl2AA/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.

Sander Elias

unread,
Mar 4, 2016, 11:18:00 PM3/4/16
to AngularJS

Hi Kevin,

Yep, that is how it works. The $http.jsonp request does all the hard work for you, and you get a nice JSON object out of it. Please note that the object you are getting is the complete response, including a lot of meta data. Do I guess it right that you are feeding this right into JSON.parse()? That would explain the error you are seeing.
If you are interested in just the data, you should do something like this:

$http  .jsonp("http://localhost:28017/...?format=jsonp&callback=JSON_CALLBACK").
  .then(function (response) {return response.data})
  .then(function (data) {
      console.log('resulting object:', data);
   }}

Or do you have another problem?

Regards
Sander

Kevin Burton

unread,
Mar 5, 2016, 12:10:29 AM3/5/16
to ang...@googlegroups.com
It is good to know that I am not doing something totally stupid. But I am still getting a syntax error. I set a breakpoint inside the first 'then' function and it never gets there. The chrome debugger seems to point to the angular callback (something like angular_callback_0).
--

Sander Elias

unread,
Mar 5, 2016, 3:01:02 AM3/5/16
to AngularJS
Hi Kevin,


Seems your server is doing some JSON Vulnerability Protection. look that up in the documentation of your server, and make the setting accordingly in your app.

If everything fails, have a look at the response in the network tab of your debugger, you can examine the raw response there, often it holds clue.

Regards
Sander 

Kevin Burton

unread,
Mar 5, 2016, 7:02:45 PM3/5/16
to AngularJS
Sorry. Not much luck. I think the syntax error is coming because of the colon in the URL for the port. Ideas? The network tab wasn't very helpful or maybe it was just because I didn't know what to look for.

Reply all
Reply to author
Forward
0 new messages