"Uncaught SyntaxError: Unexpected token :" JSONP response

Question

I make a JSONP request to server, from which I get application/json response.

My function:

  function testJSONP(url) {
    $.ajax({
      url: url,
      jsonp: "callback",
      contentType: 'application/json',
      dataType: "jsonp",
      success: function (response) {
        console.log(response);
      }
    });
  }

In Chrome console I get the following error message, and there's no output in console:

Uncaught SyntaxError: Unexpected token :

I have validated my json response manually, and it's ok.

What could be the problem then?

What's the response in the network tab? Possible you're getting a parsing error due to a malformed response. — prettyfly, Nov 15 '17 at 13:07
Doesn't setting `jsonp: "callback"` mean the response will be `callback(jsonStuff)`? — George, Nov 15 '17 at 13:08
Your server has to return javascript, not json: `callback(json)` — Joschi, Nov 15 '17 at 13:09
So if I understand it expects javascript? Can I somehow expect json as response? — , Nov 15 '17 at 13:33
@pc9529 If you want to actually read the response, just do a normal Ajax request. JSON is not an Ajax request; it is when you load a script in a ` — apsillers, Nov 15 '17 at 14:23
If you need to make the Ajax request to another origin (e.g., your site is `foo.com` and the site you want to reach is `example.com`) the site serving the JSON will need to [enable CORS](https://enable-cors.org/). If you don't control that site, but you control any other server, you can have your page make a request to the server you *do* control. Then set up your server to do the fetch to the actual target and serve it to the page. (This is a "reverse proxy") — apsillers, Nov 15 '17 at 14:29
@bergi I see that this question is a duplicate, but definitely not to the question you have linked. My two cents... — Stephan Weinhold, Jan 29 '18 at 12:50
@StephanWeinhold Well the question title of the duplicate may look as if it didn't fit, but I think I does a fine job at explaining the difference between JSON and JSONP. Could you suggest a better target? — Bergi, Jan 29 '18 at 12:59
@bergi Thanks for your answer! I think his question is client-side related. So maybe this one: https://stackoverflow.com/questions/7936610/json-uncaught-syntaxerror-unexpected-token. Or this one: https://stackoverflow.com/questions/19165925/jsonp-call-showing-uncaught-syntaxerror-unexpected-token. But again: just my opinion. — Stephan Weinhold, Jan 30 '18 at 06:02
@StephanWeinhold Oh, the first one is perfect indeed. I've added it to the targets — Bergi, Jan 30 '18 at 08:41

score 0 · Answer 1 · edited Nov 15 '17 at 14:19

0

Write like this...

function testJSONP(url) {
    $.getJSON(url,{},function(response){
        console.log(response);
    });
}

edited Nov 15 '17 at 14:19

Liam

27,717
28
128
190

answered Nov 15 '17 at 13:09

Subhankar Mitra

177
4

1

I need JSONP since the request is made to server that is on other domain, because of 'Access-Control-Allow-Origin' – Nov 15 '17 at 13:18
Have you tried this? This code will get data from cross-domain too. – Subhankar Mitra Nov 15 '17 at 13:34
Yes, I did. It got me error mentioned above. – Nov 15 '17 at 13:42

score 0 · Answer 2 · answered Nov 15 '17 at 13:12

0

Try:

function testJSONP(url) {
    $.ajax({
      url: url,
      jsonp: "callback",
      contentType: 'application/javascript',
      dataType: "jsonp",
      success: function (response) {
        console.log(response);
      }
    });
  }

answered Nov 15 '17 at 13:12

Tomasz Tracz

11
4

I get same error after trying this – Nov 15 '17 at 13:20

"Uncaught SyntaxError: Unexpected token :" JSONP response

2 Answers2