Using YUI Get Utility to consume Flickr API

I wanted to pull photos from a Flickr account onto a site. The Flickr API is awesome and there’s a ton of libraries out there for using it. Unfortunately, cURL isn’t currently installed on the server, so the PHP libraries won’t work for this case.

So I figured I’d give the YUI Get Utility a try. The Get Utility provides a mechanism for attaching script and css resources – including cross-domain resources – to the DOM after the page has loaded. And this has worked really well.

Here’s what I did:

  1. Included the following YUI scripts:
    <script src="" type="text/javascript"><!--mce:0--></script>
    <script src="" type="text/javascript"><!--mce:1--></script>
  2. Then fetch the Flickr feed in JSON format using the Get Utility.var
    objTransaction = YAHOO.util.Get.script(<url goes here>);

    Be sure that the Flickr REST call is set to output to JSON so that the Get Utility can consume it properly.  Append &format=json

  3. Then write a function to act on the JSON response from Flickr.  Here’s an example of taking the JSON response and outputting thumbnails of photos with links to the larger view:
    function jsonFlickrApi(rsp){ 
        if (rsp.stat != "ok"){
         alert('no data returned');
        for (var i=0; i<; i++){
    		var photo =[i];
    		var container = document.getElementById('container');
    		var photosList = container.getElementsByTagName('ul');
    		// create elements
    		var photoItem = document.createElement('li');
    		var photoAnchor = document.createElement('a');
    		var photoImg = document.createElement('img');
    		// set attributes
    		photoAnchor.setAttribute('href', 'http://farm'''+photo.server+'/''_'+photo.secret+'_b.jpg');
    		photoImg.setAttribute('src', 'http://farm'''+photo.server+'/''_'+photo.secret+'_s.jpg');
    		photoImg.setAttribute('width', '75');
    		photoImg.setAttribute('height', '75');
    		photoImg.setAttribute('alt', photo.title);
    		// append to DOM
        var objTransaction = YAHOO.util.Get.script("<insert_your_api_key>&photoset_id=72157594235977414+&format=json&per_page=60");

View an example

2 replies on “Using YUI Get Utility to consume Flickr API”

sure, added the entire code to the function, and linked to an example of it in action.

Leave a Reply

Your email address will not be published. Required fields are marked *