Skip to content

Instantly share code, notes, and snippets.

@davidsan

davidsan/instagram.html

Last active October 5, 2017 07:59
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save davidsan/4dc5e327d8ff1cbdeda7 to your computer and use it in GitHub Desktop.
Save davidsan/4dc5e327d8ff1cbdeda7 to your computer and use it in GitHub Desktop.
Download ZIP
Example of JSONP callback on Instagram Search API
Raw
instagram.html
<html>
<body>
<button id="btn" type="button">Search for jessicaalba on Instagram using JSONP</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/json2/20140204/json2.min.js"></script>
<script src="instagram.js"></script>
</body>
</html>
Raw
instagram.js
var URI_INSTAGRAM_SEARCH = 'https://api.instagram.com/v1/users/search';
// Your Instagram Client ID
var INSTAGRAM_CLIENT_ID = '';
function callbackInstagram(data){
var prettyJSON = JSON.stringify(data, null, 4);
output(prettyJSON);
}
function getInstagramSearch(query) {
var script = document.createElement('script');
script.setAttribute('src', URI_INSTAGRAM_SEARCH+'?q='+query+'&client_id='+INSTAGRAM_CLIENT_ID+'&callback=callbackInstagram');
document.body.appendChild(script);
}
function output(inp) {
document.body.appendChild(document.createElement('pre')).innerHTML = inp;
}
$(function(){
var button = $('#btn');
button.on('click', function(){
getInstagramSearch("jessicaalba")
});
});
@acidbjazz
Copy link

Hi, why create a script tag instead use an ajax call?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment