ラボラジアン 1. はじめに
WebSocket を使ったサンプルページを作りました。Node.js を使っています。
ソースコードは以下に置いてあります。
この中の、src/ws-server.js が本体です。
2. スクリーンショット
3. 動作
やっていることを簡単に説明します。
- Node.js に組み込まれている
httpモジュールを使って、Webサーバー(ポート番号は8080)を作成します。 - websockets/ws を使って、WebSocketサーバー(ポート番号は
8081)を作成します。 - Webサーバーを開始します。
- Webブラウザで、
http://localhost:8080にアクセスします。 - テキストフィールドに何か入力して、「WebSocketサーバーに送る」ボタンをクリックします。
- WebSocket サーバーは、クライアントからメッセージを受け取ったら、「次のメッセージを受け取りました： {受け取ったメッセージ}」という文字列をクライアントに返してきます。
- Webブラウザでは WebSocketサーバーが送ってきたメッセージを、「サーバーからのメッセージ」の下に表示していきます。
※ WebSocketの通信は継続されたままになっています。
4. 大まかな動作イメージ
Webブラウザは、まず Webサーバにアクセスします。
それから、画面上のボタンを押すことによって、WebSocketサーバに文字列を伝達します。
WebSocketサーバーから返事がきます。このやり取りは、WebSocket通信をつないだまま何度も行うことができます。
もう少し細かい図も書きました。こちらでは、ソースコードも交えて説明しています。
