Successfully reported this slideshow.
Your SlideShare is downloading. ×

HTML5-pronama-study

More Related Content

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

HTML5-pronama-study

  1. 1. WebSocketで始めるPython 2011-11-19 HTML5 プログラミング生放送勉強会 第11回@大阪
  2. 2. お前、誰よ ● 稲田 尚也 (@naoina) ● 若さ溢れる0x19歳 ● 京都のPythonista ● kyoto.py
  3. 3. 今日は WebSocket について話します
  4. 4. WebSocketとは ● WEBブラウザで使えるソケット ● まだ規格は草案(ドラフト)段階 ● 各ブラウザベンダーが先行実装
  5. 5. WebSocketとは ● WEBブラウザで使えるソケット ● まだ規格は草案(ドラフト)段階 ● 各ブラウザベンダーが先行実装 ※Iなんとかさんはお察しください
  6. 6. WebSocketとは ● WEBブラウザで使えるソケット ● まだ規格は草案(ドラフト)段階 ● 各ブラウザベンダーが先行実装 ※Iなんとかさんはお察しください ● HTML5ではない
  7. 7. WebSocket ≠ HTML5 ● 元はHTML5規格 ● 後にAPIはW3Cが、プロトコルは IETFが策定することに
  8. 8. なにが嬉しいか ● 双方向通信 ● リアルタイム性 ● 軽いプロトコル
  9. 9. プロトコル
  10. 10. プロトコル 引用: http://ja.wikipedia.org/wiki/WebSocket 基本的に各プロトコルバージョン間での互換性はない
  11. 11. プロトコル ● TCPで通信 ● 80番ポートまたは443番ポート ● 文字列およびバイナリの送受信 ● 通常のソケットとしては使えない
  12. 12. WebSocketサーバー
  13. 13. WebSocketサーバー ● Node.js + Socket.IO ● pywebsocket ● gevent-websocket ● Meinheld ● Tornado
  14. 14. WebSocketサーバー ● Node.js + Socket.IO ● pywebsocket ● gevent-websocket ● meinheld ● tornado
  15. 15. 簡単な例
  16. 16. クライアント(ブラウザ)側 1 var ws = new WebSocket('ws://127.0.0.1/chat'); 2 3 ws.onopen = function() { 4 console.log("open"); 5 } 6 7 ws.onmessage = function(msg) { 8 console.log("message received: " + msg.data); 9 } 10 11 ws.onclose = function() { 12 console.log("closed"); 13 } 14 15 ws.onerror = function() { 16 console.log("error"); 17 } 18 19 ws.send("ぐだぽよ");
  17. 17. サーバー側 1 import tornado.ioloop 2 3 from tornado.web import Application 4 from tornado.websocket import WebSocketHandler 5 6 7 class Handler(WebSocketHandler): 8 def open(self): 9 ... 10 11 def on_message(self, msg): 12 ... 13 self.write_message(msg) 14 15 def on_close(self): 16 ... 17 18 app = Application([ 19 (r"/chat", Handler), 20 ]) 21 22 if __name__ == '__main__': 23 app.listen(8080) 24 tornado.ioloop.IOLoop.instance().start()
  18. 18. ね、簡単でしょ?
  19. 19. Node.jsとSocket.IO使った方が 簡単とか言わないでください
  20. 20. One more thing
  21. 21. WebSocketを使った ニコ生コメントビューア
  22. 22. すでにあると面白くないので ググッて調べました
  23. 23. ( ^ω^)………
  24. 24. 無さそうだったので作ってみました
  25. 25. ソースコード https://github.com/naoina/html5-pronama-demo
  26. 26. 解説
  27. 27. まとめ ● WebSocketは難しくない ● Pythonを使えば簡単にWebSocket サーバーが書ける ● よってPythonを使うと幸せになる
  28. 28. 質問?
  29. 29. ありがとうございました

×