Netty入門(六)WebSocketプロトコル開発

25754 ワード
一.WebSocketプロトコルの紹介
1.WebSocketプロトコル紹介:WebSocketプロトコルは、Httpプロトコルと同地位のアプリケーション層プロトコルであり、いずれもTCPプロトコルに基づいているが、Httpプロトコルに基づいている.HTML 5は、Httpプロトコルの半二重通信モードとデータの冗長性の欠点を解決するために、WebSocketプロトコルを提案し、WebSocketプロトコルは全二重通信であり、クライアントとサービス端末間のリアルタイム通信問題を解決した.ブラウザとサーバは1回の握手を完了するだけで、両者の間に持続的なTCP接続を作成することができ、その後、サーバとクライアントはこのTCP接続を通じて双方向のリアルタイム通信を行うことができます.
2.WebSocketプロトコルの特徴
(1)WebSocketプロトコル接続を確立するために,クライアントはまずサーバにHTTP要求を送信する.すなわち、WebSocketプロトコルの最初の握手要求メッセージは、HTTPプロトコルによってベアラされるが、このHTTPメッセージは、クライアントが次にWebSocketプロトコル通信を行うことを示す「強化された」メッセージである.メッセージの形式は次のとおりです.
--- request header ---
GET /chat HTTP/1.1
Upgrade: websocket
Connection: Upgrade
Host: 127.0.0.1:8001
Origin: http://127.0.0.1:8001
Sec-WebSocket-Key: hj0eNqbhE/A0GkBXDRrYYw==
Sec-WebSocket-Version: 13

ここで、要求メッセージヘッダには、WebSocket接続のアップグレードを要求するHTTPリクエストであることを示す「Upgrade:websocket」が1つ追加されており、サーバ側は、HTTPメッセージヘッダの解析により、メッセージが通常メッセージであるか、要求メッセージであるかを判断する.
(2)WebSocketプロトコルの最初の握手メッセージを受信した場合,サーバ側は握手応答を返す必要があり,完了すると双方は確立したチャネルを介してリアルタイム双方向通信を行うことができる.ではなぜTCPはすでに3回握手しているのでしょうか.ここでWebSocketプロトコルは1回握手する必要がありますか.なぜなら、
  • TCPの握手はリンクの確立を保証するために使用され、WebSocketの握手はTCPリンクが確立した後にサーバーにWebSocketリンクであることを伝え、サーバーはWebSocketのプロトコルに従ってこのTCPリンクを処理しなければならない.

    • 二.Nettyとブラウザ間のWebSocket通信
    1.ブラウザでWebSocketを使用するコンポーネント
    ブラウザは、次のように関連するAPI(WebSocket API)を含むWebSocketプロトコル通信を行うコンポーネントWebSocketオブジェクトをJSに提供する.
    (1)コンストラクタ
    var Socket = new WebSocket(url, [protocol] );
    var ws = new WebSocket("ws://localhost:8080"); 
//    WebSocket  ，        ， http    http://    ，WebSocket   url  ws://  ，     WebSocket    wss://

    (2)関連方法
    Socket.send()
    接続を使用してデータを送信する(テキストタイプ、バイナリ、バイナリ大ファイル、配列)
    Socket.close()
    接続を閉じる(CLOSEFrameデータフレームを送信する)
    (3)属性及びコールバック方法
    ツールバーの
    説明
    Socket.readyState
    読み取り専用プロパティreadyStateは、次の値で接続ステータスを表します.
  • 0-接続が確立されていないことを示します.
  • 1-接続が確立され、通信可能であることを示します.
  • 2-接続がシャットダウンされていることを示します.
  • -接続が閉じているか、接続が開かないことを示します.

    • WebSocketオブジェクトのreadyStateが変化した場合、次のコールバックメソッドが呼び出されます.
    open
    Socket.onopen
    接続確立時にトリガー
    message
    Socket.onmessage
    クライアントがサービス側データを受信するとトリガーされます
    error
    Socket.onerror
    通信エラー発生時にトリガー
    close
    Socket.onclose
    接続クローズ時にトリガー
    aWebSocket.onopen = function(event) {
  console.log("WebSocket is open now.");
};

     2.ブラウザWebSocketクライアントコード:
    



Netty WebSocket    



if("WebSocket" in window){
    //       
	var ws = new WebSocket("ws://localhost:8000");
	//    
	ws.onopen = function()
    {
       // Web Socket     
        var ta = document.getElementById('responseText');
        ta.value="  WebSocket    ，     WebSocket  ";
    };
        
    ws.onmessage = function (event) 
    { 
      // Web Socket        
      var ta = document.getElementById('responseText');
      ta.value = "";
      ta.value = event.data;
    };
        
    ws.onclose = function(event)
    { 
        // Web Socket   
    	var ta = document.getElementById('responseText');
        ta.value = "";
        ta.value = "WebSocket    ";
    };
	
}else{
	 alert("         WebSocket!");
}

function send(message){
	if(!window.WebSocket){return;}
	if(ws.readyState == WebSocket.OPEN){
		ws.send(message);
	}else{
		alert("WebSocket        ！");
	}
}
    遅延非同期ローディングJavaScript
    formフォームの値を取得して文字列、JSOnArrayまたはJSOnObjectに変換する方法およびformが値を取得できない解決方法