Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
ActionScript3+Ruby+J2EE+Javascript.....AIR+BlazeDS+RubyYuichiro MASUI <masui@masuidrive.jp>
自己紹介
masuidrive   現在フリーランス  10分Railsムービーアバウトミー / PingKing     PukiWiki   3月に起業で渡米
お題
ビジネスメッセンジャー
専用のクライアント   ログ機能  会議室機能
専用のクライアントは   AIRで作る
Adobe AIR
インターネットの技術を使ってデスクトップアプリを     作る環境
ActionScript3+MXML  HTML+JavascriptAjaxはほとんどそのまま動く
現在ベータ3日本語処理に難あり
ブラウザと違いセキュリティ   上の制限は無い
SQLiteを内蔵しているのでビジネスアプリにも向いている
メッセージングはBlazeDSを使おう
Adobeがリリースした  オープンソースのメッセージングサーバ
元々はLiveCycle Data Serviceとして提供されていた  機能からリモーティングとメッセージングを切り出したもの
Tomcat6で動く
リモーティング
Tomcat上のメソッドを外部のActionScriptから  簡単に呼び出せる
それってRMI...それってdRuby...
メッセージング
クライアント間でメッセージ  のやり取りができる
シリアライズしたActionScriptのオブジェクト  をメッセージとして扱う
簡単なものならコードを書かないでも動く
でも私、Java分からない...
秘密兵器 JRuby
JavaVM上で動く    Ruby
多分BlazeDSもJRubyから   呼び出せるはず
Railsと組み合わせて     ログを管理
AIR        AIR         ブラウザ      BlazeDS      JRuby on Rails
言語           UI    AIR  (Flash)   ActionScript3   MXML    AIR (HTML)       Javascript    HTMLBlazeDS          Java        ...
言語           UI    AIR  (Flash)   ActionScript3   MXML    AIR (HTML)       Javascript    HTMLBlazeDS          Java        ...
言語            UI    AIR        まて。  (Flash)    AIR            ActionScript3   MXML (HTML) Javascript HTML全部違わないか?BlazeDS  ...
なんかむちゃくちゃな組み合わせな気がしてきた
まずはAIR間で動くメッセンジャーを作ろう
AIR    AIR      AIR      BlazeDS
AIR    AIR      AIR      BlazeDS
クライアント間のメッセージ交換はXMLだけで作れる
まずはBlazeDSでメッセージングサーバを    立てる
最新のβ版をダウンロード    そして展開
Tomcatも付属しているので      すぐに起動可能tomcat/webapps/blazedsに       ひな形がある
$ cp -R tomcat/webapps/blazeds   tomcat/webapps/instantmessenger        ひな形をコピー後      service-config.xml    messaging-config...
messaging-config.xml<?xml version="1.0" encoding="UTF-8"?><service id="message-service" class="flex.messaging.services.Messa...
channelは送信方法
BlazeDSはクライアントとのやり取りで複数のプロトコル    をサポートしている
<default-channels> <channel ref="my-streaming-amf"/> <channel ref="my-polling-amf"/></default-channels>
steamingは専用プロトコル ステートレスで高速だけど proxyなどが超えられない
pollingはcomet方式 httpをkeep-aliveでTCPセッションを繋いだまま定期   的にリクエストを送出HTTPなのでProxyも超えら          れる
どちらを使っているか開発者が意識する必要がない
destinationは部屋名
AIR    AIR      AIR      BlazeDS
AIR    AIR      AIR      BlazeDS
AIR      AIR      AIRsteam    steam    polling          chat        BlazeDS
$ ./tomcat/bin/startup.sh
これでこのサーバで メッセージ交換ができるようになった
AIRクライアントを作ろう
Flex builder3 betaが公開されているのこれを使う Flex SDKでも作れるけど   無理はしない方がいい
ファイル→新規→Flex プロジェクト
アプリケーションサーバは「なし」
アプリケーションサーバを指定するとXMLからサーバの  設定を引っ張ってくれる
クライアントプログラムで変更できるようにしたいので   あえて使わない
mxmlをデザインモードで開いて
UIは適当に出来上がり
AIRとBlazeDSを繋げる
Consumer - 受け手Producer - 送り手
AIR      AIR      AIRsteam    steam    polling          chat        BlazeDS
AIR        AIR        AIRProducer   Consumer   Consumer steam      steam      polling             chat           BlazeDS
AIR BlazeDS
AIR           channel       steam    polling BlazeDS
AIR                      channelProducer          steam    polling            BlazeDS
distination: chat{ message: “hoge” }                      AIR                                 channel    Producer         ...
distination: chat{ message: “hoge” }                      AIR                                   channel    Producer       ...
channels                            steam    pollingprivate var channels:Array = [];var streaming_amf:StreamingAMFChannel ...
メッセージの接続先/コンテキスト/messagebroker/チャンネル
Producer                                      channels                      (chat)var prod:Producer = new Producer();prod....
メッセージを送ってみる
Producer { message: “hoge” }                         (chat)var message:IMessage = new AsyncMessage();message.body = new Ob...
メッセージは シリアライズできる任意のオブジェクトを送ることができる
送信部分は出来上がり
続いて受信部分
AIR  BlazeDSchat
AIR                channel             steam   polling  BlazeDSchat
AIR                    channelConsumer         steam   polling       BlazeDS    chat
log.value += message                 ハンドラー登録                       AIR                                channel    Consumer ...
log.value += message                ハンドラー登録                       AIR                                channel    Consumer  ...
log.value += message                  ハンドラー登録                         AIR呼び出し                                  channel    ...
Consumer messageHandler                      channels                    (chat)var cons:Consumer cons = new Consumer();con...
messageHandlerfunction messageHandler(e:MessageEvent):void{  log.text += e.message.body.message + "n";}
動かしてみよう
クリック
クリック
直接ではなくBlazeDSを通して通信
Rubyからもメッセージを    送ってみよう
サーバでProducerを  動かせばOK
でもJavaじゃなくてRubyで
JRuby
TomcatにJRubyを インストールする
Tomcat6へJRubyを導入する方法は下記を参考に         しましたhttp://www.okisoft.co.jp/    esc/ruby/jservletServlets in JRuby on Tomcat
RubyでServletが書けます
もちろん普通にBlazeDSも   呼び出せます
Rubyからメッセージを投稿      Send.rb
必要なクラスを読み込みinclude_class "flex.messaging.MessageBroker"include_class "flex.messaging.util.UUIDUtils"include_class "flex.messa...
なにもしないSendクラスinclude_class "flex.messaging.MessageBroker"include_class "flex.messaging.util.UUIDUtils"include_class "flex.mes...
メッセージ送信部分broker = MessageBroker.getMessageBroker(nil)msg = AsyncMessage.newmsg.setDestination "chat"msg.setClientId UUIDUt...
メッセージ送信できあがり
Rubyからでも簡単に BlazeDSが扱える
クライアントがActionScript3   サーバがJ2EEだと  言語の違いが大きすぎる
AS3と組み合わせるなら Rubyの方が合ってる
さて次はログを取る機能を実装
続きはWebで
「Adobe DevelopersConnection」に掲載予定
BlazeDSの正式版が出てからだから3月になるかも
今回の資料とソースはblog.masuidrive.jpで
感想
既にLCDSとして枯れた  コードをベースにしてメッセージングができるのは    大変うれしい
JRubyとの合わせも     簡単
でもそもそもJRubyが....
AIRにはグラフ系コンポーネ  ントも揃っているので
ログやノーティファイアを  作るのが面白そう
Ajaxもサポートしているので Webでリアルタイムインタ  フェースを作るときには      検討価値大
AIR+Blaze+Ruby
AIR+Blaze+Ruby
AIR+Blaze+Ruby
AIR+Blaze+Ruby
AIR+Blaze+Ruby
AIR+Blaze+Ruby
AIR+Blaze+Ruby
AIR+Blaze+Ruby
AIR+Blaze+Ruby
Upcoming SlideShare
Loading in …5
×

AIR+Blaze+Ruby

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Be the first to comment

AIR+Blaze+Ruby

  1. 1. ActionScript3+Ruby+J2EE+Javascript.....AIR+BlazeDS+RubyYuichiro MASUI <masui@masuidrive.jp>
  2. 2. 自己紹介
  3. 3. masuidrive 現在フリーランス 10分Railsムービーアバウトミー / PingKing PukiWiki 3月に起業で渡米
  4. 4. お題
  5. 5. ビジネスメッセンジャー
  6. 6. 専用のクライアント ログ機能 会議室機能
  7. 7. 専用のクライアントは AIRで作る
  8. 8. Adobe AIR
  9. 9. インターネットの技術を使ってデスクトップアプリを 作る環境
  10. 10. ActionScript3+MXML HTML+JavascriptAjaxはほとんどそのまま動く
  11. 11. 現在ベータ3日本語処理に難あり
  12. 12. ブラウザと違いセキュリティ 上の制限は無い
  13. 13. SQLiteを内蔵しているのでビジネスアプリにも向いている
  14. 14. メッセージングはBlazeDSを使おう
  15. 15. Adobeがリリースした オープンソースのメッセージングサーバ
  16. 16. 元々はLiveCycle Data Serviceとして提供されていた 機能からリモーティングとメッセージングを切り出したもの
  17. 17. Tomcat6で動く
  18. 18. リモーティング
  19. 19. Tomcat上のメソッドを外部のActionScriptから 簡単に呼び出せる
  20. 20. それってRMI...それってdRuby...
  21. 21. メッセージング
  22. 22. クライアント間でメッセージ のやり取りができる
  23. 23. シリアライズしたActionScriptのオブジェクト をメッセージとして扱う
  24. 24. 簡単なものならコードを書かないでも動く
  25. 25. でも私、Java分からない...
  26. 26. 秘密兵器 JRuby
  27. 27. JavaVM上で動く Ruby
  28. 28. 多分BlazeDSもJRubyから 呼び出せるはず
  29. 29. Railsと組み合わせて ログを管理
  30. 30. AIR AIR ブラウザ BlazeDS JRuby on Rails
  31. 31. 言語 UI AIR (Flash) ActionScript3 MXML AIR (HTML) Javascript HTMLBlazeDS Java ー Rails Ruby HTML
  32. 32. 言語 UI AIR (Flash) ActionScript3 MXML AIR (HTML) Javascript HTMLBlazeDS Java ー Rails Ruby HTML
  33. 33. 言語 UI AIR まて。 (Flash) AIR ActionScript3 MXML (HTML) Javascript HTML全部違わないか?BlazeDS Java ー Rails Ruby HTML
  34. 34. なんかむちゃくちゃな組み合わせな気がしてきた
  35. 35. まずはAIR間で動くメッセンジャーを作ろう
  36. 36. AIR AIR AIR BlazeDS
  37. 37. AIR AIR AIR BlazeDS
  38. 38. クライアント間のメッセージ交換はXMLだけで作れる
  39. 39. まずはBlazeDSでメッセージングサーバを 立てる
  40. 40. 最新のβ版をダウンロード そして展開
  41. 41. Tomcatも付属しているので すぐに起動可能tomcat/webapps/blazedsに ひな形がある
  42. 42. $ cp -R tomcat/webapps/blazeds tomcat/webapps/instantmessenger ひな形をコピー後 service-config.xml messaging-config.xmlを 書き換える
  43. 43. messaging-config.xml<?xml version="1.0" encoding="UTF-8"?><service id="message-service" class="flex.messaging.services.MessageService"> <adapters> <adapter-definition id="actionscript" class="flex.messaging.services.messaging.adapters.ActionScriptAdapter" default="true" /> <adapter-definition id="jms" class="flex.messaging.services.messaging.adapters.JMSAdapter"/> </adapters> <default-channels> <channel ref="my-streaming-amf"/> <channel ref="my-polling-amf"/> </default-channels> <destination id="chat"/></service>
  44. 44. channelは送信方法
  45. 45. BlazeDSはクライアントとのやり取りで複数のプロトコル をサポートしている
  46. 46. <default-channels> <channel ref="my-streaming-amf"/> <channel ref="my-polling-amf"/></default-channels>
  47. 47. steamingは専用プロトコル ステートレスで高速だけど proxyなどが超えられない
  48. 48. pollingはcomet方式 httpをkeep-aliveでTCPセッションを繋いだまま定期 的にリクエストを送出HTTPなのでProxyも超えら れる
  49. 49. どちらを使っているか開発者が意識する必要がない
  50. 50. destinationは部屋名
  51. 51. AIR AIR AIR BlazeDS
  52. 52. AIR AIR AIR BlazeDS
  53. 53. AIR AIR AIRsteam steam polling chat BlazeDS
  54. 54. $ ./tomcat/bin/startup.sh
  55. 55. これでこのサーバで メッセージ交換ができるようになった
  56. 56. AIRクライアントを作ろう
  57. 57. Flex builder3 betaが公開されているのこれを使う Flex SDKでも作れるけど 無理はしない方がいい
  58. 58. ファイル→新規→Flex プロジェクト
  59. 59. アプリケーションサーバは「なし」
  60. 60. アプリケーションサーバを指定するとXMLからサーバの 設定を引っ張ってくれる
  61. 61. クライアントプログラムで変更できるようにしたいので あえて使わない
  62. 62. mxmlをデザインモードで開いて
  63. 63. UIは適当に出来上がり
  64. 64. AIRとBlazeDSを繋げる
  65. 65. Consumer - 受け手Producer - 送り手
  66. 66. AIR AIR AIRsteam steam polling chat BlazeDS
  67. 67. AIR AIR AIRProducer Consumer Consumer steam steam polling chat BlazeDS
  68. 68. AIR BlazeDS
  69. 69. AIR channel steam polling BlazeDS
  70. 70. AIR channelProducer steam polling BlazeDS
  71. 71. distination: chat{ message: “hoge” } AIR channel Producer steam polling BlazeDS
  72. 72. distination: chat{ message: “hoge” } AIR channel Producer steam polling BlazeDS chat
  73. 73. channels steam pollingprivate var channels:Array = [];var streaming_amf:StreamingAMFChannel = new StreamingAMFChannel("my-streaming-amf", "http://127.0.0.1:8400/instantmessenger/messagebroker/streamingamf");channels.push(streaming_amf);var polling_amf:AMFChannel = new AMFChannel("my-polling-amf", "http://127.0.0.1:8400/instantmessenger/messagebroker/amfpolling");polling_amf.pollingEnabled = true;polling_amf.pollingInterval = 3000;channels.push(polling_amf);
  74. 74. メッセージの接続先/コンテキスト/messagebroker/チャンネル
  75. 75. Producer channels (chat)var prod:Producer = new Producer();prod.destination = "chat";prod.channelSet = new ChannelSet();for(index in channels) { prod.channelSet.addChannel(channels[index]);}prod.connect();
  76. 76. メッセージを送ってみる
  77. 77. Producer { message: “hoge” } (chat)var message:IMessage = new AsyncMessage();message.body = new Object();message.body.message = "hoge";prod.send(message);
  78. 78. メッセージは シリアライズできる任意のオブジェクトを送ることができる
  79. 79. 送信部分は出来上がり
  80. 80. 続いて受信部分
  81. 81. AIR BlazeDSchat
  82. 82. AIR channel steam polling BlazeDSchat
  83. 83. AIR channelConsumer steam polling BlazeDS chat
  84. 84. log.value += message ハンドラー登録 AIR channel Consumer steam polling BlazeDS chat
  85. 85. log.value += message ハンドラー登録 AIR channel Consumer steam polling BlazeDS{ message: “hoge” } chat
  86. 86. log.value += message ハンドラー登録 AIR呼び出し channel Consumer steam polling BlazeDS { message: “hoge” } chat
  87. 87. Consumer messageHandler channels (chat)var cons:Consumer cons = new Consumer();cons.destination = "chat";cons.channelSet = new ChannelSet();for(var index:String in channels) { cons.channelSet.addChannel(channels[index]);}cons.addEventListener(MessageEvent.MESSAGE,messageHandler);
  88. 88. messageHandlerfunction messageHandler(e:MessageEvent):void{ log.text += e.message.body.message + "n";}
  89. 89. 動かしてみよう
  90. 90. クリック
  91. 91. クリック
  92. 92. 直接ではなくBlazeDSを通して通信
  93. 93. Rubyからもメッセージを 送ってみよう
  94. 94. サーバでProducerを 動かせばOK
  95. 95. でもJavaじゃなくてRubyで
  96. 96. JRuby
  97. 97. TomcatにJRubyを インストールする
  98. 98. Tomcat6へJRubyを導入する方法は下記を参考に しましたhttp://www.okisoft.co.jp/ esc/ruby/jservletServlets in JRuby on Tomcat
  99. 99. RubyでServletが書けます
  100. 100. もちろん普通にBlazeDSも 呼び出せます
  101. 101. Rubyからメッセージを投稿 Send.rb
  102. 102. 必要なクラスを読み込みinclude_class "flex.messaging.MessageBroker"include_class "flex.messaging.util.UUIDUtils"include_class "flex.messaging.messages.AsyncMessage"
  103. 103. なにもしないSendクラスinclude_class "flex.messaging.MessageBroker"include_class "flex.messaging.util.UUIDUtils"include_class "flex.messaging.messages.AsyncMessage"class Send < HttpServlet def doPost(req, res) res.content_type = text/html; charset="UTF-8" // ∼ ここに処理を追加 ∼ wf = res.writer wf.println OK endend
  104. 104. メッセージ送信部分broker = MessageBroker.getMessageBroker(nil)msg = AsyncMessage.newmsg.setDestination "chat"msg.setClientId UUIDUtils.createUUIDmsg.setMessageId UUIDUtils.createUUIDmsg.setTimestamp Time.now.to_f*1000message_body = req.get_parameter("message") ¦¦ ""msg.setBody({message => message_body})broker.routeMessageToService(msg, nil)
  105. 105. メッセージ送信できあがり
  106. 106. Rubyからでも簡単に BlazeDSが扱える
  107. 107. クライアントがActionScript3 サーバがJ2EEだと 言語の違いが大きすぎる
  108. 108. AS3と組み合わせるなら Rubyの方が合ってる
  109. 109. さて次はログを取る機能を実装
  110. 110. 続きはWebで
  111. 111. 「Adobe DevelopersConnection」に掲載予定
  112. 112. BlazeDSの正式版が出てからだから3月になるかも
  113. 113. 今回の資料とソースはblog.masuidrive.jpで
  114. 114. 感想
  115. 115. 既にLCDSとして枯れた コードをベースにしてメッセージングができるのは 大変うれしい
  116. 116. JRubyとの合わせも 簡単
  117. 117. でもそもそもJRubyが....
  118. 118. AIRにはグラフ系コンポーネ ントも揃っているので
  119. 119. ログやノーティファイアを 作るのが面白そう
  120. 120. Ajaxもサポートしているので Webでリアルタイムインタ フェースを作るときには 検討価値大

×