WebSocketsWebSocketを使い始める


備考

このセクションでは、websocketの概要と、なぜ開発者がそれを使いたいのかを説明します。

websocket内の大きなテーマについても言及し、関連するトピックにリンクする必要があります。 websocketのドキュメンテーションは新しいので、それらの関連トピックの初期バージョンを作成する必要があります。

インストールまたはセットアップ

ウェブソケットのセットアップまたはインストールに関する詳細な手順。

web-socketクライアントの例

これはjavascriptのWebソケットクライアントの例です。
それ:

  1. ライブデモサーバーに接続します。
  2. メッセージを送信します。
  3. メッセージを受信します。
  4. 一定時間後に切断します。
var mySocket    = null;
var serverUrl   = 'wss://echo.websocket.org';  //  wss: is ws: but using SSL.
var oWebSocket  = window.WebSocket || window.MozWebSocket;
if (oWebSocket) {
    mySocket = new oWebSocket (serverUrl);
    if (mySocket) {
        console.log (mySocket);
        mySocket.onopen     = onSocketOpen;
        mySocket.onclose    = onSocketClose;
        mySocket.onmessage  = onSocketMessage;
        mySocket.onerror    = onSocketError;

        setTimeout (closeSocket, 5000);  //  Be polite and free socket when done.
    }
}

function onSocketOpen (evt) {
    console.log ("Socket is now open.");
    mySocket.send ("Hello from my first live web socket!");
}

function onSocketClose (evt) {
    console.log ("Socket is now closed.");
}

function onSocketMessage (evt) {
    console.log ("Recieved from socket: ", evt.data);
}

function onSocketError (evt) {
    console.log ("Error with/from socket!:");
    console.log (evt);
}

function closeSocket () {
    if (mySocket.readyState !== mySocket.CLOSED) {
        console.log ("Closing socket from our end (timer).");
        mySocket.close ();
    }
    else
        console.log ("Socket was already closed (timer).");
}
 

コンソールでそのコードを実行すると、次のような結果が得られます。

WebSocket { url: "wss://echo.websocket.org/", readyState: 0, bufferedAmount: 0, onopen: null,
    onerror: null, onclose: null, extensions: "", protocol: "", onmessage: null,
    binaryType: "blob" 
}
2  //  <--- 2 was the socket ID in this instance.
Socket is now open. 
Recieved from socket:  Hello from my first live web socket! 
Closing socket from our end (timer). 
Socket is now closed.