Clever Geek Handbook

WebSockets-完全非同期Web

数週間前、Google Chromium開発者がWebSocketテクノロジーのサポートに関するニュースを投稿しました。 ITブルジョワでは、ニュースは爆発する爆弾の効果を生み出しました。 同じ日に、非常に有名なさまざまなIT専門家が新製品をテストし、ブログに絶賛を残しました。 さまざまなサーバー/ライブラリ/フレームワーク（ Apache、EventMachine、Twisted、MochiWebなどを含む）の開発者はすぐに、WebSocketのサポートが近い将来に製品に実装されることを発表しました。

私たちを約束するテクノロジーの何がそんなに面白いですか？ 私の意見では、 WebSocketは、HTTPプロトコルの開始以来、最も劇的な拡張機能です。 これは簡単なことではなく、HTTPパラダイムの変化です。 最初は、「要求/応答」のモデルに基づいて構築された同期プロトコルは、 完全に非同期で対称になります。 固定ロールを持つクライアントとサーバーはなくなりましたが、データ交換には2つのピアがあります。 それぞれが独自に機能し、必要に応じて別のデータを送信します。 送信された-そして、待って何もしなかった。 2番目の側は、必要に応じて答えます-すぐにではないかもしれませんし、まったくないかもしれません。 このプロトコルは、データ交換の完全な自由を提供します。使用方法はユーザーが決定します。



あなたが開発している場合、ウェブソケットは法廷に来ると信じています：

-交換とチャネルの速度を要求する、集中的なデータ交換を伴うWebアプリケーション。

-標準に準拠したアプリケーション。

-「長期にわたる」Webアプリケーション。

-ページ上に多くの異なる非同期ブロックを持つ複雑なアプリケーション。

-クロスドメインアプリケーション。







そして、それはどのように機能しますか？





とても簡単です！ ページがサーバー上のWebソケットを開くことを決定すると、特別なjavascriptオブジェクトを作成します。

  1. <script>
  2. ws = new WebSocket("ws://site.com/demo");
  3.  
  4. // -:
  5.  
  6. // , :
  7. ws.onopen = function() { alert("Connection opened...") };
  8.  
  9. // -
  10. ws.onclose = function() { alert("Connection closed...") };
  11.  
  12. // , , - , - -
  13. ws.onmessage = function(evt) { $("#msg").append("<p>"+evt.data+"</p>"); };
  14.  
  15. </script>
* This source code was highlighted with Source Code Highlighter.







?


HTTP-. TCP 80 GET-:

GET /demo HTTP/1.1

Upgrade: WebSocket

Connection: Upgrade

Host: site.com

Origin: http://site.com







, :

HTTP/1.1 101 Web Socket Protocol Handshake

Upgrade: WebSocket

Connection: Upgrade

WebSocket-Origin: http://site.com

WebSocket-Location: ws://site.com/demo









, TCP- . — «» , .

- , - :

0x00, < UTF-8>, 0xFF





— , 0x00, — 0xFF. — , ! , : XML, JSON, .

, , «» - onmessage.



, 95%. AJAX-, . . TCP- — — — .

:

, - UTF-8! , .









?


WebSockets . - :

0x80, < - >, < >





« »? , . : (0) (1), 7 . : - 0x80, «», — , «», , 0 . — «». «» . . 7- .



, - — GIF 43 :

0x80, 0x2B, < >





160 2 :

0x80, 0x81, 0x20, < >





, ?



?





, TCP- — , , -. ( - , 1 TCP- . :) ).

, — , , .





WebSockets Comet — Bayuex, LongPolling, MultiPart . , , , . : «» . «» - «» — .. ( ) 2, , . , , . , - — - -. , — , .



, 2 : AJAX WebSockets. - — , -. , , -, .. . , . : — . - onmessage . - , , . ? LongPolling ( ) .





HTTP - . , , .. «» . , . , , TCP-. , .



-


HTTP . - , , — Bayeux Protocol.

, -. , . — ( ) — — . , .



-


« » AJAX- — - . , . . WebSockets . «---», «-», , . , Origin. websocket-. , .

! - !



?


!



UPDATE: - www.mibbit.com ( ).

PHP- WebSocket phpDaemon, WebSocketServer. , «pong» () «ping» — ExampleWebSocket.

tcpdump , .





? . « » -, . , , (!) . WebKit — Safari. .



, ?


— web-socket-js -. , - . .





, , . - . « AJAX», - WebSockets .



...



, . ...



: WebSockets —


More articles:


All Articles