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

このトピックでは、Adobe AIRのActionScript 3.0Twitter 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