AIRでTwitter APIライブラリを使用する例

このトピックでは、Adobe AIRのActionScript 3.0でTwitter APIライブラリを使用する例を紹介します。 Twitterは2つの認証方法をサポートしています。基本認証と優先OAuthの使用は推奨されていません。 ライブラリはOAuthを介して認証を実装します。

この例では、認証にOAuthプロトコルを使用し、ツイートを送信して友人のステータスを表示できるAIRアプリケーションの実装について説明します。





開始するには、必要なmxml構造を作成します。 ViewStackには2つのウィンドウが必要です。 最初のウィンドウは認証ウィンドウです( HTMLコンポーネントとPINコード入力フィールドがあります)。

  1. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >



  2. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >



  3. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >



  4. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >



  5. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >



  6. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >



  7. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >



  8. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >



  9. <mx:VBox width= "100%" height= "100%" id= "authScreen" > <mx:TextInput text= "{authHTML.location}" editable= "false" width= "100%" /> <mx:HTML id= "authHTML" width= "100%" height= "100%" /> <mx:HBox width= "100%" horizontalAlign= "center" verticalAlign= "middle" > <mx:Label text= "Enter pin here:" /> <mx:TextInput id= "pinTextInput" /> <mx:Button label= "Ok" click= "pinOkButton_clickHandler(event)" id= "pinOkButton" /> </mx:HBox > </mx:VBox >





2番目のウィンドウは、友達のツイートとツイートを送信するフィールドのリストです。

  1. <mx:VBox幅= "100%"高さ= "100%" id = "twitterScreen" >
  2. <mx:リストの幅= "100%"高さ= "100%" dataProvider = "{twitterStatuses}" id = "tweetsList" >
  3. <mx:itemRenderer >
  4. <mx:コンポーネント >
  5. <mx:HBox幅= "100%"高さ= "100" borderStyle = "solid" >
  6. <mx:画像の高さ= "100%"ソース= "{data.user.profileImageUrl}" />
  7. <mx:VBoxの高さ= "100%"幅= "100" >
  8. <mx:テキスト幅= "100%"テキスト= "{data.user.screenName}" />
  9. <mx:テキスト幅= "100%"テキスト= "{data.createdAt}" />
  10. </ mx:VBox >
  11. <mx:テキストの幅= "100%"高さ= "100%"テキスト= "{data.text}" />
  12. </ mx:HBox >
  13. </ mx:コンポーネント >
  14. </ mx:itemRenderer >
  15. </ mx:リスト >
  16. <mx:HBox width = "100%" horizo​​ntalAlign = "center" verticalAlign = "middle" >
  17. <mx:TextArea width = "100%" height = "100%" id = "tweetTextInput"
  18. textInput = "tweetTextInput_textInputHandler(event)" />
  19. <mx:ボタンラベル= 「送信」クリック= 「sendTweetButton_clickHandler(イベント)」
  20. enabled = "{tweetTextInput.text!= ''}"
  21. 高さ= "100%"
  22. id = "sendTweetButton" />
  23. </ mx:HBox >
  24. </ mx:VBox >


デスクトップアプリケーションのOAuth認証アルゴリズムは次のとおりです。



Twitter APIとのすべての対話は、 TwitterAPIクラスを介して行われます。

  1. var twitterApi : TwitterAPI = new TwitterAPI ( ) ;


そして、 twitterApi.connectionプロパティを介したOAuth認証。

  1. //イベントを受信するリクエストトークンをリッスンします
  2. twitterApi.connection。 addEventListener ( OAuthTwitterEvent.REQUEST_TOKEN_RECEIVED、handleRequestTokenReceived ) ;
  3. //リクエストトークンrequestのエラーイベントをリッスンします
  4. twitterApi.connection。 addEventListener ( OAuthTwitterEvent.REQUEST_TOKEN_ERROR、handleRequestTokenError ) ;
  5. //アクセストークンアクセスエラーイベントをリッスンします
  6. twitterApi.connection。 addEventListener ( OAuthTwitterEvent.ACCESS_TOKEN_ERROR、handleAccessTokenError ) ;
  7. //認証成功のイベントをリッスンします
  8. twitterApi.connection。 addEventListener ( OAuthTwitterEvent.AUTHORIZED、handleAuthorized ) ;
  9. //ログイン
  10. twitterApi.connection.authorize ( CONSUMER_KEY、CONSUMER_SECRET ) ;


リクエストトークンを正常に受信したら、Twitterへのユーザーアクセスを表示する必要があります。





これは次のように行われます。

  1. 保護された 関数 handleRequestTokenReceived (イベント: OAuthTwitterEvent ) : void
  2. {
  3. authHTML.location = twitterApi.connection.authorizeURL;
  4. }


ユーザーがPINコードを入力したら、APIに送り返す必要があります。

  1. 保護された 関数 pinOkButton_clickHandler ( event : MouseEvent ) : void
  2. {
  3. twitterApi.connection.grantAccess ( pinTextInput。text ) ;
  4. }


認証が成功すると、 twitterScreenウィンドウに切り替えてツイートをアップロードします。

  1. //ステータスの読み込み操作を初期化します
  2. var op : TwitterOperation = new LoadHomeTimeline ( ) ;
  3. //コマンド完了イベントをリッスンします
  4. var handler : Function = function ( event : TwitterEvent ) : void
  5. {
  6. op。 removeEventListener ( TwitterEvent。COMPLETE、ハンドラー) ;
  7. if ( event.success )
  8. {
  9. //操作は正常に完了しました
  10. status = "Tweets loaded" ;
  11. //ダウンロードしたツイートのリストを取得します
  12. twitterStatuses =イベント。 ArrayCollection としての データ 。
  13. }
  14. 他に
  15. {
  16. //操作は失敗しました
  17. status = "読み込みエラー:" +イベント。 データ toString ( ) ;
  18. }
  19. } ;
  20. op。 addEventListener ( TwitterEvent。COMPLETE、ハンドラー) ;
  21. //操作を実行します
  22. twitterApi.post ( op ) ;


ツイート自体は次のように送信されます。

  1. var text : String = tweetTextInput。 テキスト
  2. //ステータス更新操作を初期化します
  3. var op : TwitterOperation = new UpdateStatus ( text ) ;
  4. var handler : Function = function ( event : TwitterEvent ) : void
  5. {
  6. op。 removeEventListener ( TwitterEvent。COMPLETE、ハンドラー) ;
  7. if ( event.success )
  8. {
  9. //操作は正常に完了しました
  10. status = "Tweet sent" ;
  11. loadTweets ( ) ;
  12. tweetTextInput。 テキスト = "" ;
  13. }
  14. 他に
  15. {
  16. //操作は失敗しました
  17. status = "ステータス送信エラー:" +イベント。 データ toString ( ) ;
  18. }
  19. } ;
  20. op。 addEventListener ( TwitterEvent。COMPLETE、ハンドラー) ;
  21. //操作を実行します
  22. twitterApi.post ( op ) ;


どの操作もtwitterApi.post(operation、postType、priority)メソッドで実行できます。 さらに、各コマンドの指定された優先度で順次実行することも、前の操作を完了することなくpost()メソッドを実行した直後に実行することもできます。 このため、 postTypeフィールドはそれぞれPOST_TYPE_NORMALまたはPOST_TYPE_ASYNCである必要があります。 サポートされているすべての操作のリストはこちらです: dev.dborisenko.com/twitter-actionscript-api/docs/commands-summary.html



ソースの例: dev.dborisenko.com/twitter-actionscript-api/examples/TwitterAIRDemo/srcview

コンパイルされた例: twitter-actionscript-api.googlecode.com/files/TwitterAIRDemo.air

ライブラリリンク: twitter-actionscript-api.googlecode.com/files/TwitterAPI_v1.2.swc

ライブラリドキュメント: dev.dborisenko.com/twitter-actionscript-api/docs

Google Codeのライブラリ自体: code.google.com/p/twitter-actionscript-api



All Articles