FlashでFlickrの写真を表示させたり、スライドショーを作ったりするサンプルはたくさんあるのだけれども、Flickrに写真をアップロードしたかったのでas3flickrlib を使ってアップロードを試してみた。

サンプルswfのダウンロード
(FlickrUploadTest.zip)

※残念ながらwww.flickr.comのサーバーに"crossdomain.xml"がないので(api.flickr.comにはある。)swfをwebにアップした状態からはアップロードの処理がうまく動きませんでした。ローカルで実行してください。

as3flickrlib as3flickrlib - Google Code
as3corelib as3corelib - Google Code

をそれぞれ用意する。

2007年12月3日現在は写真アップロードをするための”com.adobe.webapis.flickr.methodgroups.Upload.upload();"
が今のダウンロードできるバージョンではメソッド自体がないことが判明。しかたないので、as3flickrlibに関しては、SVNから最新版を取得した。

取得したas3flickrlibとas3corelibはソースディレクトリにcomディレクトリ以下を配置するか、Flash CS3のコンパイラにパスを通しておく。

これで下準備は完了。

2.Flickrの認証の仕方
My first Apollo App – Flickr Sets viewer « The FlexWinds blogの認証部分のコードを参考にFlickrの認証の手順の流れのコードを書いた。 Thanks Pavan Podila. :-)

a.b.c.で手順を説明

a.Flickrの認証はapi keyとsecretを送信してfrobを取得。

private static  var API_KEY:";

private static  var SECRET:";


_service=new FlickrService(API_KEY);

_service.secret=SECRET;

_service.addEventListener(FlickrResultEvent.AUTH_GET_FROB,onAuthGetFrobHandler);

private function onAuthGetFrobHandler(event:FlickrResultEvent):void {

	if (event.success) {

		//forbの処理が成功したら

		myTrace("AuthGetFrobに成功");

		//forbを保存

		_frob=event.data.frob;

	} else {

		myTrace("AuthGetFrobに失敗");

		myTrace("APIKEYとSECRETを確認してください");

		trace(event);

	}

}

public function startAuth():void {

	_service.auth.getFrob();

}

startAuth();

public function getLoginUrl(frob:String,permission:String):String {

	return _service.getLoginURL(frob,permission);

}


//Tokenの認証はブラウザで行うのでブラウザを開く

myTrace("ブラウザでFlickrの認証開始");

var authUrl:String=this.getLoginUrl(_frob,AuthPerm.WRITE);

navigateToURL(new URLRequest(authUrl),"_blank");

public function getAuthToken(frob:String):void {

	_service.auth.getToken(frob);

}

private function updateServiceCredentials(authResult:AuthResult):void {

	myTrace("トークンとパーミッションのアップデート");

	_service.token=authResult.token;

	_service.permission=authResult.perms;

}

_service.addEventListener(FlickrResultEvent.AUTH_GET_TOKEN,onGetAuthTokenHandler);


private function onGetAuthTokenHandler(event:FlickrResultEvent):void {

	if (event.success) {

		//成功したら

		myTrace("GetAuthTokenに成功");

		//この後はトークンとパーミッションを_serviceに反映させる

		var authResult:AuthResult=event.data.auth;

		this.updateServiceCredentials(authResult);

	} else {

		myTrace("GetAuthTokenに失敗");

		myTrace("ブラウザで認証を完了してください");

		trace(event);

	}

}

getAuthToken(_frob);

3.写真のアップロード
写真のアップロードは簡単で、Uploadオブジェクトを認証済みのFlickrServiceオブジェクトを引数に生成してuploadメソッドにファイルリファレンスオブジェクトを渡してあげればＯＫ。

uploadメソッドのドキュメントはないが、as3flickrlibのソースコードから、

upload(

  fileReference:FileReference,//ＵＰする写真

  title:String = "",//タイトル

  description:String = "",//ディスクリプション

  tags:String = "",//タグ

  is_public:Boolean = false,//全体に公開するかどうか？

  is_friend:Boolean = false,//友人までの公開にするかどうか？

  is_family:Boolean = false //家族までの公開にするかどうか？

) 

であることがわかるのでいろいろなオプションも指定できることがわかる。

ここではファイルの名前も渡してタイトルも指定している。

upload= new Upload(_service);
upload.upload(pFile,pFile.name);

以下ソースコード

package {

	import fl.controls.Button;

	import flash.display.BitmapData;

	import flash.display.Sprite;

	import flash.net.*;

	import flash.events.*;

	import flash.events.Event;

	import flash.events.MouseEvent;

	/**

	* as3flickrlib(http://code.google.com/p/as3flickrlib/)のインポート

	*(2007/12/03現在は as3flickrlibはSVNのバージョンを使用しないとUpload.upload()メソッドが使えない。

	* as3flickrlibの使用にはas3corelib(http://code.google.com/p/as3corelib/)も必要。

	*/

	import com.adobe.webapis.flickr.FlickrService;

	import com.adobe.webapis.flickr.events.FlickrResultEvent;

	import com.adobe.webapis.flickr.AuthResult;

	import com.adobe.webapis.flickr.AuthPerm;

	import com.adobe.webapis.flickr.methodgroups.*;


	public class main extends Sprite {

		public var _service:FlickrService;

		//Flickrのページから自分のAPIKEYとSECRETを入手してここに変数として定義する

		private static  var API_KEY:";

		private static  var SECRET:";

		private var _frob:String;

		public var upload:Upload;

		private var pFile:FileReference;

		public function main() {

			//FlickerServiceオブジェクトの生成

			_service=new FlickrService(API_KEY);

			_service.secret=SECRET;

			//ファイルリファレンスオブジェクトの生成

			pFile = new FileReference();

			//Event listeners

			_service.addEventListener(FlickrResultEvent.AUTH_GET_FROB,onAuthGetFrobHandler);

			_service.addEventListener(FlickrResultEvent.AUTH_GET_TOKEN,onGetAuthTokenHandler);

			//

			bt1.addEventListener(MouseEvent.CLICK,function(e:MouseEvent){startAuth()});

			bt2.addEventListener(MouseEvent.CLICK,function(e:MouseEvent){getAuthToken(_frob);});

			bt3.addEventListener(MouseEvent.CLICK,function (e:MouseEvent){fileSelect();});

			bt4.addEventListener(MouseEvent.CLICK,function (e:MouseEvent){startUpload();});

			//ステージに置いたボタンの初期化に自分の初期化イベントを追加する。

			bt2.addEventListener (Event.ADDED,function(e:Event){bt2.enabled=false;bt2.removeEventListener(Event.ADDED,arguments.callee);});

			bt3.addEventListener (Event.ADDED,function(e:Event){bt3.enabled=false;bt3.removeEventListener(Event.ADDED,arguments.callee);});

			bt4.addEventListener (Event.ADDED,function(e:Event){bt4.enabled=false;bt4.removeEventListener(Event.ADDED,arguments.callee);});

			//ファイルリファレンスにイベントリスナー追加

			pFile.addEventListener(DataEvent.UPLOAD_COMPLETE_DATA, uploadCompleteHandler);

			pFile.addEventListener(ProgressEvent.PROGRESS, progressHandler);

			pFile.addEventListener(Event.CANCEL,function(e:Event){bt4.enabled=false});

			pFile.addEventListener(Event.SELECT,fileSelectHandler);

			//

		}

		/**

		 * 認証用のログインページのＵＲＬを取得

		 */

		public function getLoginUrl(frob:String,permission:String):String {

			return _service.getLoginURL(frob,permission);

		}

		/**

		 * 認証を開始

		*/

		public function startAuth():void {

			_service.auth.getFrob();

		}

		/**

		 * getTokenを開始

		 */

		public function getAuthToken(frob:String):void {

			_service.auth.getToken(frob);

		}

		/**

		 * トークンとパーミッションのアップデート

		 */

		private function updateServiceCredentials(authResult:AuthResult):void {

			myTrace("トークンとパーミッションのアップデート");

			_service.token=authResult.token;

			_service.permission=authResult.perms;

		}

		/**

		 * AuthGetFrobの結果を処理するハンドラ

		 */

		private function onAuthGetFrobHandler(event:FlickrResultEvent):void {

			if (event.success) {

				//forbの処理が成功したら

				myTrace("AuthGetFrobに成功");

				//forbを保存

				_frob=event.data.frob;

				//Tokenの認証はブラウザで行うのでブラウザを開く

				myTrace("ブラウザでFlickrの認証開始");

				var authUrl:String=this.getLoginUrl(_frob,AuthPerm.WRITE);

				navigateToURL(new URLRequest(authUrl),"_blank");

				//ブラウザの認証後にOKボタン(getAuthToken)の実行をユーザーにさせる。

				myTrace("ブラウザで認証した後にOKをクリックしてください");

				bt2.enabled=true;

				bt1.enabled=false;

			} else {

				myTrace("AuthGetFrobに失敗");

				myTrace("APIKEYとSECRETを確認してください");

				trace(event);

			}

		}

		/**

		 * GetAuthTokenの結果を処理するハンドラ

		 */

		private function onGetAuthTokenHandler(event:FlickrResultEvent):void {

			if (event.success) {

				//成功したら

				myTrace("GetAuthTokenに成功");

				//この後はトークンとパーミッションを_serviceに反映させる

				var authResult:AuthResult=event.data.auth;

				this.updateServiceCredentials(authResult);

				bt2.enabled=false;

				bt1.enabled=false;

				bt3.enabled=true;

			} else {

				myTrace("GetAuthTokenに失敗");

				myTrace("ブラウザで認証を完了してください");

				trace(event);

			}

		}

		/**

		 * アップロードを開始

		 */

		public function startUpload() {

			upload= new Upload(_service);

			upload.upload(pFile,pFile.name);

			bt3.enabled=false;

			bt4.enabled=false;

			myTrace("ＵＰ中");

		}

		/**

		 * アップロードが完了したときに実行されるハンドラ

		 */

		function uploadCompleteHandler(e:DataEvent) {

			var resultXML:XML= new XML(e.data);

			myTrace("up完了 写真のIDは"+resultXML.photoid);

			progress.text="";

			bt3.enabled=true;

			bt4.enabled=true;

		}

		/**

		* アップロード中に実行されるハンドラ

		*/

		private function progressHandler(event:ProgressEvent):void {

			var pfile:FileReference = FileReference(event.target);

			if (event.bytesLoaded!= event.bytesTotal) {

				progress.text=("ファイルの名前:" + pfile.name + "\nアップしたサイズ:" + event.bytesLoaded + "\n写真のサイズ:" + event.bytesTotal);

			} else {

				progress.text=("ファイルの名前:" + pfile.name + "\nアップロードしたファイルの検証中");

			}

		}

		/**

		 * ファイルを選択するダイアログを実行

		 */

		public function fileSelect() {

			pFile.browse(getTypes());

		}

		/**

		 * セレクトできるファイルの種類を指定

		 */

		private function getTypes():Array {

			var allTypes:Array=new Array(getImageTypeFilter());

			return allTypes;

		}

		private function fileSelectHandler(e:Event) {

			myTrace("選択したファイル:"+pFile.name);

			if (_service.token!="") {

				bt4.enabled=true;

			}

		}

		/**

		 * セレクトできるファイルの種類のオブジェクトを生成

		 */

		private function getImageTypeFilter():FileFilter {

			return new FileFilter("Images (*.jpg, *.jpeg, *.gif, *.png)","*.jpg;*.jpeg;*.gif;*.png");

		}

		/**

		 * UIに値を表示

		 */

		public function myTrace(param:String) {

			textArea.text=param + "\n" + textArea.text;

		}

	}

}

ソースコード一式（ZIP）