JavaScript WebSocketでサーバーに接続する

最終更新日

WebSocketでサーバーに接続するには、「new WebSocket()」として、パラメータに接続先のサーバーを指定します。このときには、「http://」ではなく、「ws://」を使います。データを暗号してセキュアな通信を行う場合は、「wss://」を指定します。また、「192.168.11.1:4649」のようにポート番号を指定することもできます。他にも「WebSocket()」の2番目のパラメータにサブプロトコルを指定することもできます。サーバーと接続状況は、WebSocketオブジェクトのreadStateプロパティで確認することができます。

readStateプロパティ

キーワード値説明
0CONNECTING接続中
1OPEN接続済み
2CLOSING切断中
3CLOSED切断された

また、サーバーとの接続が確立されると、openイベントが発生します。

<body>
<script>
    window.addEventListener("load", function(){
        var ele = document.getElementsByTagName("output")[0];
        //WebSocketオブジェクトを生成する
        var ws = new WebSocket("ws://192.168.11.1:9001");
        //接続状態を確認
        var msg = ["接続中","接続済み","切断中","切断された"];
        //接続状態を表示する
        ele.innerHTML = "ステータス:"+msg[ws.readySState];
    }, false);
</script>
<h1>WebSocketで接続する</h1>
<output></output>

</body>
実行結果