Trapper Markelz :: flickrAPI with ASP,VBscript,XML,XSL

flickrAPI with ASP,VBscript,XML,XSL

When I started playing around with the Flickr API for my photoGALLERY, I had a hard time finding any examples of using the API calls with ASP/VBScript. So, I thought I would share how I did my photo page for anyone else out there looking for instructions on how to get started.

Updated: 12/26/2005

<< Back to theSANDBOX

Using the API

The Flickr API gives you tons of options... I narrowed it down to the two modules that I was most interested in:

flickr.photosets.getlist - for listing out your photosets
flickr.tags.getListUserPopular - for displaying your tags. I passed in a value of "100" for the "count" parameter to make my list.

Make sure you read the documentation about the API calls. Each URL has a specific set of required and optional parameters. One thing they don't make very clear is that you have to authenticate the URL call. Oh and you need to get your own API key. In the end, the URLs for the above two methods will look something like:

Get Photosets:
http://www.flickr.com/services/rest/?method=flickr.photosets.getList
&api_key=[YOUR KEY]&user_id=[LONG USERID]

Get Tags:
http://www.flickr.com/services/rest/?method=flickr.tags.getListUserPopular
&api_key=[YOUR KEY]&count=100&user_id=[LONG USERID]

If you don't know what a LONG USERID is, use the API explorer for any method and it will show it at the top.

Building your ASP function

Next you need a function that will hit the API, passing the URL in as a parameter. The other parameter of your funtion will be the style sheets to render the XML. I just put this function right inside my photo.asp page:

<!-- Function to retrieve Flickr XML document -->
<%
Function getFlickrXML(flickrUrl, xslSheet)
   dim styleFile
   dim source1, style
   styleFile = Server.MapPath(xslSheet)

   dim xmlhttp
   set xmlhttp = Server.CreateObject("Microsoft.XMLHTTP")
   xmlhttp.Open "GET", flickrUrl, false
   xmlhttp.Send

   set source1 = Server.CreateObject("Microsoft.XMLDOM")
   source1.async = false
   source1.loadxml(xmlhttp.ResponseText)

   set style = Server.CreateObject("Microsoft.XMLDOM")
   style.async = false
   style.load(styleFile)

   Response.Write source1.transformNode(style)
   set source1 = nothing
   set style = nothing
   set xmlhttp = nothing
End Function
%>

Calling this function in your page will look something like:

<%= getFlickrXML("http://www.flickr.com/services/rest/?
method=flickr.tags.getListUserPopular&api_key=
[YOUR KEY]&count=100&user_id=[LONG USERID]",
"flickr-tags.xsl")%>

Using XSL

Now that we have a handy function that will send a URL call to Flickr and get back XML, you need to do something with that XML... like display it. In order to handle the two URLs listed above, I wrote two XSLs to style the results. Click to download/view them:

flickr-sets.xsl - formats the xml for photo sets with a picture, link and count
flickr-tags.xsl - formats the xml for the tags. I approximated the text sizing to match the flickr interface

Put those files in the same directory on your web server as the page with the function and you are good to go!

Other Flickr Tricks

Not everything on the photoGALLERY page required the API:

The Daily Zeitgeist - A fun flash applet.
The FlickrBadge - This is how I do the most recent on my homepage and the most recent five photos in the gallery.

Contact Me

If you have any more questions, you can contact me.