Tweaking The AS3 Flickr API in Flex and AIR

I’ve discovered a handful of issues using the AS3 Flickr API in Flex 3 and AIR, and as a result I’ve made a number of tweaks, additions and bugfixes to the source code.

Aside from recompiling the SWC (see here), here are the bugs I’ve found and some of the changes I’ve made:

Auth.checkToken()
This method is used to return the credentials attached to an authentication token. If you’ve already gone through the login process in your application and are loading a saved auth token, this is the method you call to verify the token is still valid.

However there is a bug in the method parameters passed to the flickr.auth.checkToken API method.

Here’s the original method:

public function checkToken (token : String) : void {     MethodGroupHelper.invokeMethod (_service, checkToken_result,         ”flickr.auth.checkToken”, false, new NameValuePair         (“auth_token”, token)); }

The problem is the fourth parameter; a boolean that determines whether the method needs to be signed. The value here is false, when in fact it needs to be true.

The updated method:

public function checkToken (token : String) : void {     MethodGroupHelper.invokeMethod (_service, checkToken_result,         ”flickr.auth.checkToken”, true, new NameValuePair         (“auth_token”, token)); }

FlickrService, User Public Properties
These two classes contain a large number of public properties you’ll likely end up referencing in your application. For FlickrService, this includes the auth token and its associated permissions. For User, this includes the NSID, username and pro status of the authorized Flickr account.

While there’s nothing wrong with these classes, none of these properties are made [Bindable] by default. So if you reference any of these properties as a bindable value in a MXML component, you’ll need to modify the source code accordingly.

User.buddyIconUrl
This is a property I added to the User class. It points to the buddy icon URL of the authorized Flickr user.

You can implement this in one of two ways. First, you could add a basic getter/setter to User, and then set the property in the result handler for a FlickrService.people.getInfo() method call:

private function onGetInfo (event : FlickrResultEvent) : void {     if (event.success)     {         var user : User = event.data ["user"] as User;         user.buddyIconUrl = “http://farm4.static.flickr.com/”             + user.iconServer + “/buddyicons/” + user.nsid + “.jpg”;     } }

Second, you could make the property read-only by adding just the getter to User and building the URL directly in the method:

public function get buddyIconUrl () : String {     return “http://farm4.static.flickr.com/”         + iconServer + “/buddyicons/” + nsid + “.jpg”; }

I’ll update this post if I discover more bugs or make new tweaks to the API.

How to Use The Flickr API in Flex 3

The AS3 Flickr API on Google Code (as3flickrlib) is a great tool for integrating Flickr into your Flex or Flash application.

But if you want to include the SWC in a Flex 3 or AIR project, you need to download the source code and recompile it as a Flex 3 Library. The SWC included in the zip file is compiled for Flex 2 and will generate a runtime error when you try to instantiate an instance of FlickrService.

Once you have the Flex 3 SWC in your project, using the actual Flickr API is pretty straightforward. As with all third-party Flickr apps, you first need to authenticate your application for a Flickr user.

Here’s a simplified version of the login process:

var flickr : FlickrService = new FlickrService (YOUR_FLICKR_API_KEY); flickr.secret = YOUR_FLICKR_API_SECRET; flickr.addEventListener (FlickrResultEvent.AUTH_GET_FROB, onGetFrob); // starts the Flickr login process flickr.auth.getFrob (); private function onGetFrob (event : FlickrResultEvent) : void {     if (event.success)     {         var frob : String = event.data.frob as String;         var authURL : String = flickr.getLoginURL (frob, AuthPerm.READ);         navigateToURL (new URLRequest (authURL), “_blank”);     } }

The authURL is the page on Flickr where you authenticate your application. Your app needs to be authenticated before you can retrieve an auth token:

flickr.addEventListener (FlickrResultEvent.AUTH_GET_TOKEN, onGetToken); flickr.auth.getToken (frob); private function onGetToken (event : FlickrResultEvent) : void {     if (event.success)     {         var authResult : AuthResult = event.data as AuthResult;         flickr.token = authResult.token;         flickr.permission = authResult.perms;     } }

Once you have an auth token, you should have access to the private information in the user’s account, and depending on the permission level, the ability to add, edit and delete photos and metadata.