Unexpected token : in jQuery ajax call

Question

I'm trying to make a simple request to instagram as follows:

 $.getJSON("https://www.instagram.com/kidsfromthe90sband/media/?callback=?", function(data) { alert(JSON.stringify(data)); }); 

http://jsfiddle.net/FPhcr/731/

However it says Uncaught SyntaxError: Unexpected token : in the console, but the uri is ok and it works if I, for example, run it in Postman or directly in the browser. I've searched other questions but I cannot get to know my error. Thank you.

EDIT

If I don't put a callback=? there's another error: No 'Access-Control-Allow-Origin' header is present on the requested resource

Answer 1

Actually when you are using any social app data like for facebook,linkedin or instagram in your case etc you need to register your app there so you get unique token & id which help them to authenticate you.So,they can fullfill your request through their provided public API .

Its happening because as per JSONP the result /responce should be wrapped inside callback which is not happening in this case.

EDIT :

you need to subscribe to instagram after which you get your ACCESS-TOKEN.

then form url like this one

https://api.instagram.com/v1/tags/coffee/media/recent?access_token=ACCESS-TOKEN&callback=callbackFunction

which will give jsonp.

Please refer here for more

1. devloper
2. endpoints

Answer 2

You are treating the API as if it would return JSONP data, but it does not. So jQuery then tries to evaluate the pure JSON return as JSONP and logs the error.

You have to find the correct API endpoint for JSONP, there is a documentation that can be found here: https://www.instagram.com/developer/endpoints/ .