WebSocketについて<br />Spring_MT<br />2011/06/18 社内勉強会<br />
WebSocketとは?<br />・公式draft<br />  http://dev.w3.org/html5/websockets/<br />・何ができるの?<br />一言でいうと・・・・<br />Client側とServer側のリ...
従来の方法<br />一体何が問題なの?<br />・従来の手法だと、HTTP通信に頼るしかない<br /> ->同時接続数が多いと<br />  メモリなどのリソースを大量に消費する。<br />  1リクエスト/レスポンスヘッダー自体は数K...
HTTPのヘッダー<br />・リクエストヘッダー<br />GET / HTTP/1.1<br />Host: today.is.sky.blue.sky<br />User-Agent: Mozilla/5.0 (Macintosh; U;...
従来の方法<br />一体何が問題なの?<br />・従来の手法だと、HTTP通信に頼るしかない<br /> ->同時接続数が多いと<br />  メモリなどのリソースを大量に消費する。<br />  1リクエスト/レスポンスヘッダー自体は数K...
ポーリング例<br />
WebSocket<br />通信にHTTPではなく、別のプロトコルWSを使う<br /> (ただし、接続の確立にはHTTPを使用)<br />・一回接続を確立すれば、ステートフルに通信可能<br /> TCPの接続を張り続けておく<br />...
WebSocket<br />通信にHTTPではなく、別のプロトコルWSを使う<br /> (ただし、接続の確立にはHTTPを使用)<br />・一回接続を確立すれば、ステートフルに通信可能<br /> TCPの接続を張り続けておく<br />...
WSのヘッダー<br />・リクエスト<br />GET /demo HTTP/1.1<br />  Host: example.com<br />  Connection: Upgrade<br />  Sec-WebSocket-Key2:...
対応ブラウザ<br />対応しているブラウザは下記の二つ<br />Safari 5<br />Chrome 10<br />FireFoxは?<br />Firefox 4 の Beta 8 以降から WebSocketのサポートを無効化する...
実際におこる確率<br />Cache Poisoning<br />Flash : 0.12%<br />Java Applet : 0.15%<br />WebSocket: 0.01%<br />原文<br />http://www.ad...
WebSocketの中身<br />・ブラウザ側のAPI<br /> 旧WebSockets API<br />・サーバと通信するための通信プロトコル<br /> 旧WebSocket protocol<br />この二つがWebSocketの...
WebSocket API<br />
WebSocket protocol<br />・クライアントからサーバにTCP接続してhandshakeする<br />・handshakeのリクエスト/レスポンスのやりとりはHTTPそのもの<br />・クライアントはリクエストボディで8バ...
WebSocket protocol<br />・クライアントからサーバにTCP接続してhandshakeする<br />・handshakeのリクエスト/レスポンスのやりとりはHTTPそのもの<br />・クライアントはリクエストボディで8バ...
くううううう<br />Mojoをつかったwebsocket<br />CORE<br />  Perl        (5.010000, darwin)<br />Mojolicious (1.45, Smiling Face With S...
Upcoming SlideShare
Loading in …5
×

20110622 haruyama webso]cket

1,516 views
1,444 views

Published on

メモ程度です。
間違っていることを書いているかもしれません・・・・

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,516
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

20110622 haruyama webso]cket

  1. 1. WebSocketについて<br />Spring_MT<br />2011/06/18 社内勉強会<br />
  2. 2. WebSocketとは?<br />・公式draft<br /> http://dev.w3.org/html5/websockets/<br />・何ができるの?<br />一言でいうと・・・・<br />Client側とServer側のリアルタイム通信が<br />よりシンプルにかつ、<br />付加が少なく実現できる<br />Client(ブラウザ)、Server(web server)<br />今までの技術でも実現可能<br />ex). Comet<br />                    何が問題なの?<br />
  3. 3. 従来の方法<br />一体何が問題なの?<br />・従来の手法だと、HTTP通信に頼るしかない<br /> ->同時接続数が多いと<br />  メモリなどのリソースを大量に消費する。<br />  1リクエスト/レスポンスヘッダー自体は数KB<br />・HTTPだとステートレスな通信しかできない<br /> ->セッション管理等が面倒<br />ex.)クッキーに情報を保存する<br />リクエストのURIパラメータにすべての値を指定する(例:http://example.com/?val=[a,b,c]) <br />
  4. 4. HTTPのヘッダー<br />・リクエストヘッダー<br />GET / HTTP/1.1<br />Host: today.is.sky.blue.sky<br />User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; ja-JP-mac; rv:1.9.2.14) Gecko/20110218 Firefox/3.6.14<br />Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8<br />Accept-Language: ja,en-us;q=0.7,en;q=0.3<br />Accept-Encoding: gzip,deflate<br />Accept-Charset: Shift_JIS,utf-8;q=0.7,*;q=0.7<br />Keep-Alive: 115<br />Connection: keep-alive<br />Cookie: wp-settings-1=editor%3Dhtml%26m1%3Do%26m3%3Dc; wp-settings-time-1=1304502829; __utma=56171822.1273043786.1307855232.1307855232.1307855232.1; __utmz=56171822.1307855232.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none)<br />・レスポンスヘッダー<br />HTTP/1.1 200 OK<br />Date: Mon, 20 Jun 2011 18:12:40 GMT<br />Content-Type: text/plain; charset=UTF-8<br />Connection: close<br />Transfer-Encoding: chunked<br />
  5. 5. 従来の方法<br />一体何が問題なの?<br />・従来の手法だと、HTTP通信に頼るしかない<br /> ->同時接続数が多いと<br />  メモリなどのリソースを大量に消費する。<br />  1リクエスト/レスポンスヘッダー自体は数KB<br />・HTTPだとステートレスな通信しかできない<br /> ->セッション管理等が面倒<br />ex.)クッキーに情報を保存する<br />リクエストのURIパラメータにすべての値を指定する(例:http://example.com/?val=[a,b,c]) <br />
  6. 6. ポーリング例<br />
  7. 7. WebSocket<br />通信にHTTPではなく、別のプロトコルWSを使う<br /> (ただし、接続の確立にはHTTPを使用)<br />・一回接続を確立すれば、ステートフルに通信可能<br /> TCPの接続を張り続けておく<br />・一回あたりのデータ転送のオーバーヘッドが小さい<br />データの前後に1バイトずつ付けた「データフレーミング」という形式<br />「数キロバイトのデータ転送量を(最低)2バイトへ、150msの遅延を50msにできるとしたら、それはわずかな向上といったような生やさしいものではない。実際この2つの事実だけをもっても、WebSocketをGoogleにとって本気にさせるには十分なものだ」<br />
  8. 8.
  9. 9. WebSocket<br />通信にHTTPではなく、別のプロトコルWSを使う<br /> (ただし、接続の確立にはHTTPを使用)<br />・一回接続を確立すれば、ステートフルに通信可能<br /> TCPの接続を張り続けておく<br />・一回あたりのデータ転送のオーバーヘッドが小さい<br />データの前後に1バイトずつ付けた「データフレーミング」という形式<br />「数キロバイトのデータ転送量を(最低)2バイトへ、150msの遅延を50msにできるとしたら、それはわずかな向上といったような生やさしいものではない。実際この2つの事実だけをもっても、WebSocketをGoogleにとって本気にさせるには十分なものだ」<br />
  10. 10. WSのヘッダー<br />・リクエスト<br />GET /demo HTTP/1.1<br /> Host: example.com<br /> Connection: Upgrade<br /> Sec-WebSocket-Key2: 12998 5 Y3 1 .P00<br /> Sec-WebSocket-Protocol: sample<br /> Upgrade: WebSocket<br /> Sec-WebSocket-Key1: 4 @1 46546xW%0l 1 5<br /> Origin: http://example.com<br /> ^n:ds[4U<br />・レスポンス<br />HTTP/1.1 101 WebSocket Protocol Handshake<br /> Upgrade: WebSocket<br /> Connection: Upgrade<br /> Sec-WebSocket-Origin: http://example.com<br /> Sec-WebSocket-Location: ws://example.com/demo<br /> Sec-WebSocket-Protocol: sample<br /> 8jKS'y:G*Co,Wxa-<br />この後は・・・・<br />0x00[Data]0xFF という形式でやり取りを行う<br />
  11. 11. 対応ブラウザ<br />対応しているブラウザは下記の二つ<br />Safari 5<br />Chrome 10<br />FireFoxは?<br />Firefox 4 の Beta 8 以降から WebSocketのサポートを無効化すると決定したのは、プロトコルレベルのセキュリティ問題によるものです。Beta 7 では Chrome や Safari 同様に -76 バージョンのプロトコルをサポートしています。Beta 8 からはサポートされません。<br />https://dev.mozilla.jp/hacksmozillaorg/websockets-disabled-in-firefox-4/<br />実際は、FlashやJava appletにもいえる問題です。<br />http://blog.livedoor.jp/kotesaki/archives/1600864.html<br />
  12. 12. 実際におこる確率<br />Cache Poisoning<br />Flash : 0.12%<br />Java Applet : 0.15%<br />WebSocket: 0.01%<br />原文<br />http://www.adambarth.com/papers/2011/huang-chen-barth-rescorla-jackson.pdf<br />
  13. 13. WebSocketの中身<br />・ブラウザ側のAPI<br /> 旧WebSockets API<br />・サーバと通信するための通信プロトコル<br /> 旧WebSocket protocol<br />この二つがWebSocketの中身<br />WebSocketはW3Cによって規定されるAPIと<br />IETFによって規定されている通信プロトコルによってなりたちます。<br />以前はAPIの方を「The Web Sockets API」(複数形)、<br />プロトコルの方を「The Web Socket protocol」(単数形)としていましたが、<br />現在では両者とも「The WebSocket」に統一されたようです。<br />
  14. 14. WebSocket API<br />
  15. 15. WebSocket protocol<br />・クライアントからサーバにTCP接続してhandshakeする<br />・handshakeのリクエスト/レスポンスのやりとりはHTTPそのもの<br />・クライアントはリクエストボディで8バイトのランダム文字列(challenge)を送る<br />・サーバは16バイトのresponse文字列を返す<br />・handshake後、TCP接続は張りっぱなしにする<br />・handshake後のTCP接続上、双方向にデータを送信可能<br />・テキストデータは 0x00 で始まり 0xff で終了するフレーム単位<br />・テキストデータの文字コードはUTF8<br />・バイナリデータも送れる(タイプと長さを最初に送る)<br />・URLは ws:// or wss://<br />・紳士的な切断は 0xff 0x00 を送って、0xff 0x00 を受信してからTCPレベルで切断<br />
  16. 16. WebSocket protocol<br />・クライアントからサーバにTCP接続してhandshakeする<br />・handshakeのリクエスト/レスポンスのやりとりはHTTPそのもの<br />・クライアントはリクエストボディで8バイトのランダム文字列(challenge)を送る<br />・サーバは16バイトのresponse文字列を返す<br />・handshake後、TCP接続は張りっぱなしにする<br />・handshake後のTCP接続上、双方向にデータを送信可能<br />・テキストデータは 0x00 で始まり 0xff で終了するフレーム単位<br />・テキストデータの文字コードはUTF8<br />・バイナリデータも送れる(タイプと長さを最初に送る)<br />・URLは ws:// or wss://<br />・紳士的な切断は 0xff 0x00 を送って、0xff 0x00 を受信してからTCPレベルで切断<br />ラッパーされていることがほとんどなので、何やっているかはライブラリの中身をみないと・・・<br />でも時間がなかったです。。。。。。。<br />
  17. 17. くううううう<br />Mojoをつかったwebsocket<br />CORE<br /> Perl (5.010000, darwin)<br />Mojolicious (1.45, Smiling Face With Sunglasses)<br />で動かず・・・・<br />

×