WebSocket.close() - 通信を切断する

2017/10/04

close()は、WebSocketのメソッドです。サーバーとの通信を切断します。このメソッドを実行して通信が切断した時、closeイベントが発生し、oncloseで設定したイベントが発火します。

概要

名前

所属

IDL

void close(optional [Clamp] unsigned short code, optional USVString reason);

仕様書

https://html.spec.whatwg.org/multipage/web-sockets.html#dom-websocket-close

説明

第1引数(code)には、1000、または3000〜4000の整数を指定する。

第2引数(reason)には、切断理由を表す文字列を指定する。

引数の値はCloseEventに渡されるとされていましたが、2017年10月現在、仕様書(WHATWG)では、リスナーに渡されるオブジェクトはCloseEventではなくEventとされているため、ここでは取り扱いません。

チュートリアル

ソケット通信を切断する例です。

var ws = new WebSocket( "wss://socket.syncer.jp/connect" ) ;

ws.onclose = function ( event ) {
	console.log( event ) ;
	console.log( "通信を切断しました。" ) ;
}

ws.close() ;

デモ

WebSocket.close()のデモです。接続後、「切断」をクリックすると、ソケット通信を切断します。

<!-- このコードは編集できます。 -->

<!DOCTYPE html>
<html>
<head>
<style>
	div#result { white-space: pre-wrap ; }
</style>
</head>
<body>
	<p>
		<button id="hoge">接続</button>
		<button id="fuga">切断</button>
	</p>
<hr>
	<div id="result"></div>
<script>
var ws = null ;
var element1 = document.getElementById( "hoge" ) ;
var element2 = document.getElementById( "fuga" ) ;

// 接続
element1.onclick = function () {
	if ( ws && ws.readyState === 1 ) return false ;

	ws = new WebSocket( "wss://socket.syncer.jp/connect" ) ;

	ws.onopen = function() {
		ws.onmessage = function( message ) {
			logUpdate( message.data ) ;
		}

		ws.onclose = function( event ) {
			console.log( event ) ;
			logUpdate( "通信を切断しました。" ) ;
		}
	}
}

// 切断
element2.onclick = function () {
	if ( ws && ws.readyState === 1 ) ws.close() ;
}

var logUpdate = function ( text, noDate ) {
	var resultElement = document.getElementById( "result" ) ;
	resultElement.textContent = text + ( noDate ? "" : "(" + new Date().toLocaleString() + ")" ) + "\n" + resultElement.textContent ;
}
</script>
</body>
</html>