クライアント側で接続の切断を処理するには？
解説
サーバーとの接続の切断は「close([code],[reason])」メソッドを使用します。引数はすべて省略可能です。
第１引数のcodeはWebSocketプロトコルで決められた切断時のステータスコードを指定します。第２引数のreasonには文字列で切断理由を指定します。コード体系は以下のようになっています。
WebSocketの接続は双方向接続であるため、サーバーとクライアントのどちらかが明示的に、あるいは既定のタイムアウト期間に達して切断しない限り維持されます。window.onunloadイベントハンドラで「close([code],[reason])」メソッドを呼び出すことで、不要な接続が維持されるのを避けることができます。
切断時の処理はoncloseイベントハンドラを定義します。
// wsはWebSocketオブジェクト、infoは情報表示用のdiv要素
// 切断時の処理
ws.onclose = function(event){
// 切断が完全に完了したかどうか
if(event.wasClean){
var closed = "完了";
} else {
var closed = "未完了";
}
info.innerHTML += "切断処理：" + closed + "<br>";
info.innerHTML += "コード：" + event.code + "<br>";
info.innerHTML += "理由：" + event.reason + "<br>";
}
window.onunload = function(event){
// 切断
ws.close(4500,"切断理由");
}
oncloseイベントハンドラの引数はCloseEventオブジェクトで、通常のEventオブジェクトに追加して、「wasClean」「code」「reason」の各属性が存在します。wasClean属性はイベント発生時に接続の切断が完全に完了した後であればtrueが、そうでなければfalseが格納されます。
code属性とreason属性の意味は「close([code],[reason])」メソッドの引数と同じです。
ただし、切断時のステータスコードと接続理由の指定は、SafariとOperaが準拠しているバージョンの仕様の後に定義されたため、「close([code],[reason])」メソッドの引数としても、CloseEventオブジェクトの属性としても、この二つのブラウザではサポートされていません。
関連項目
