リアルタイムデータプッシュでのWebSocketのアプリケーションの実践と実装

M66 2025-07-28

導入

インターネットテクノロジーの急速な発展により、リアルタイムのデータプッシュは、最新のアプリケーションシステムの不可欠な部分になりました。従来のHTTPプロトコルは広く使用されていますが、リクエスト応答モードはリアルタイムデータ送信のニーズを満たすことはできません。フルダプレックス通信プロトコルとして、WebSocketは、永続的な接続を確立することにより、クライアントとサーバーの間でリアルタイムと双方向で通信できます。この記事では、リアルタイムのデータプッシュおよび実際のコードの例を介してこの機能を実装する方法を示すWebSocketの適用について説明します。

WebSocketの紹介

WebSocketは、TCPプロトコルに基づく通信プロトコルです。 HTTPプロトコルとは異なり、クライアントとサーバーの間に継続的な双方向通信接続を確立できます。 WebSocketの出現は、リアルタイムのデータプッシュでHTTPプロトコルの制限を解決し、リアルタイムチャット、株式取引、オンラインゲーム、その他のシナリオで広く使用されています。

WebSocketアプリケーションシナリオ

WebSocketには幅広いアプリケーションシナリオがあり、以下は典型的なアプリケーションケースです。

ライブチャットシステム：WebSocketはリアルタイムでメッセージを配信し、インスタントメッセージング機能を実現できます。
リアルタイム監視システム：WebSocketは、監視データをリアルタイムでプッシュして、システムの応答速度と精度を向上させることができます。
株式取引システム：WebSocketは、株式市場のリアルタイムの更新に適しており、投資家が最速の市場情報を取得できるようにします。
リアルタイムゲームコミュニケーション：WebSocketは、リアルタイムの戦闘、プレーヤーのステータスの更新など、マルチプレイヤーオンラインゲームでのリアルタイムデータ送信をサポートします。

WebSocketアプリケーションの練習

サーバー側の実装

リアルタイムのデータプッシュにWebSocketを使用するには、最初にサーバー側にWebSocketサーバーを作成する必要があります。 node.jsを例として使用すると、「WS」モジュールを使用してWebSocketサーバーをすばやく構築できます。簡単な例コードは次のとおりです。

 const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', (ws) => {
  console.log('Client connected');
  setInterval(() => {
    ws.send(new Date().toString());
  }, 1000);
  ws.on('close', () => {
    console.log('Client disconnected');
  });
});

コード説明：

WebSocketサーバーを作成し、ポート8080を聴きました。
クライアントが接続すると、サーバーは「接続」イベントをトリガーして双方向通信を確立します。
それぞれに、現在の時刻は毎秒クライアントに送信されます。

クライアントの実装

クライアントは、ブラウザの内蔵Websocketオブジェクトを使用してサーバーに接続し、リアルタイムでデータを受信できます。これがクライアントコードの例です。

 const ws = new WebSocket('ws://localhost:8080');
ws.onopen = () => {
  console.log('Connected to WebSocket server');
};
ws.onmessage = (message) => {
  console.log('Received message: ' + message.data);
};
ws.onclose = () => {
  console.log('Disconnected from WebSocket server');
};

コード説明：

クライアントは、 `new WebSocket（）`を介してサーバーへの接続を作成します。
接続が成功したときに「Onopen」イベントがトリガーされます。
サーバーからのメッセージがプッシュされると、オンメッサージイベントがトリガーされます。
「onclose」イベントは、接続が閉じたときにトリガーされます。

結論は

強力なリアルタイム通信プロトコルとして、WebSocketはリアルタイムデータプッシュシナリオで広く使用されています。この記事では、単純なコードを介してサーバーとクライアント間のWebSocket間にリアルタイムデータプッシュを実装する方法を示します。この実用的な例を使用すると、開発者はプロジェクトでWebSockをより効率的に実装し、さまざまなビジネスシナリオに合わせて要件に応じて機能を拡大できます。