WebSocket は、単一の存続期間の長い接続を介して全二重通信チャネルを提供し、クライアント (通常は Web ブラウザ) とサーバー間のリアルタイム通信を可能にします。ここでは、HTML5 で WebSocket を使用する方法の基本的な概要を示します。

1. WebSocket API: WebSocket API は、ほとんどの最新ブラウザでサポートされています。 WebSocket 接続を確立するには、JavaScript でWebSocketオブジェクトを使用できます。

    JavaScript
    // Create a WebSocket instance
   const socket = new WebSocket('ws://example.com/socket');
   
   // Event handlers
   socket.onopen = function(event) {
     console.log('WebSocket connection opened:', event);
   };
   
   socket.onmessage = function(event) {
     console.log('Received message:', event.data);
   };
   
   socket.onclose = function(event) {
     console.log('WebSocket connection closed:', event);
   };
   
   // Send a message
   socket.send('Hello, server!');
   

2. サーバーの実装: WebSocket 通信をサポートするサーバーが必要です。一般的な選択肢には、 wsなどのライブラリを使用した Node.js や、Socket.IO などのフレームワークの使用が含まれます。

   Node.js とwsライブラリを使用した例:

    JavaScript
    const WebSocket = require('ws');
   const server = new WebSocket.Server({ port: 3000 });
   
   server.on('connection', (socket) => {
     console.log('Client connected');
   
     // Handle messages from clients
     socket.on('message', (message) => {
       console.log('Received:', message);
       // Send a response
       socket.send('Hello, client!');
     });
   
     // Handle the connection closing
     socket.on('close', () => {
       console.log('Client disconnected');
     });
   });
   

3. セキュア接続 (WSS): Web サイトで HTTPS を使用している場合は、セキュリティのため、 wsではなくwss (WebSocket Secure) を使用する必要があります。これにより、暗号化された通信が保証されます。

    JavaScript
    const socket = new WebSocket('wss://example.com/socket');
   

4. エラー処理:エラー処理を実装して、予期しない状況を管理します。

    JavaScript
    socket.onerror = function(error) {
     console.error('WebSocket error:', error);
   };
   

5. ブロードキャスト:サーバーは、接続されているすべてのクライアントにメッセージをブロードキャストできます。

    JavaScript
    // Inside the server connection handler
   server.clients.forEach((client) => {
     if (client.readyState === WebSocket.OPEN) {
       client.send('Broadcast message to all clients');
     }
   });
   

6. 接続を閉じる:クライアントまたはサーバーから WebSocket 接続を閉じることができます。

    JavaScript
    // Close the connection from the client
   socket.close();
   
   // Close the connection from the server
   // Inside the server connection handler
   socket.close();
   

これらは、開始するための基本的な例にすぎません。特定の使用例によっては、認証、さまざまな種類のメッセージの処理、接続障害の処理など、さらに多くの機能を実装する必要がある場合があります。