【サーバーNo.578】今更聞けない！WebSocketをサクッと解説

WebSocketについて知らない方にも理解しやすいように、この記事ではその仕組みや活用方法をわかりやすく解説します。Webの通信がどのように変わったのかを具体例とともにご紹介します。

Table of Contents

WebSocketとは？

WebSocketは、クライアントとサーバー間でリアルタイム通信を実現するためのプロトコルです。通常のHTTP通信と異なり、接続を維持しながら双方向でデータをやり取りできる特徴があります。

わかりやすい具体的な例

チャットアプリでのメッセージ送受信

sequenceDiagram participant User as ユーザー participant App as チャットアプリ participant Server as サーバー User->>App: メッセージ入力 App->>Server: WebSocketでメッセージ送信 Server->>App: 他のユーザーのメッセージをリアルタイム配信 App->>User: メッセージ表示 note over Server: 接続は常時維持

ユーザーがチャットアプリにメッセージを入力すると、WebSocketを通じて即座にサーバーに送信され、他のユーザーにもリアルタイムで反映されます。

株価表示サイトのリアルタイム更新

sequenceDiagram participant User as ユーザー participant Browser as ブラウザ participant Server as 株価データサーバー Browser->>Server: WebSocket接続要求 loop 継続的な更新 Server->>Browser: 最新の株価データ送信 Browser->>User: 画面を即時更新 end note over Server: HTTPでは都度接続が必要

株価サイトでは、WebSocketを利用することで、都度ページをリロードせずとも最新の株価が自動的に更新されます。

WebSocketはどのように考案されたのか

従来のHTTP通信では、都度リクエストとレスポンスが必要で、リアルタイム性が求められるアプリケーションには不向きでした。この課題を解決するために、WebSocketが登場しました。2008年に議論が始まり、2011年にRFC 6455として標準化されました。

flowchart TD A[HTTP通信] -- 接続のたびにリクエスト発生 --> B[効率が悪い] B --> C[リアルタイム通信に課題] C --> D[WebSocket提案] D --> E[RFC 6455標準化] E --> F[常時接続・双方向通信可能]

考案した人の紹介

WebSocketは、Googleのエンジニアであるイアン・ヒックソン氏（Ian Hickson）によって考案されました。彼はHTML5仕様策定にも深く関与し、Web通信の効率化を追求していました。リアルタイム性を求めるユーザーの声と、HTTP通信の限界を感じたことが考案のきっかけでした。

考案された背景

2000年代後半、Webアプリケーションの進化によりリアルタイム通信の需要が高まりました。しかし、既存のHTTP通信ではレスポンスの遅延が問題視され、特にチャットやゲーム、金融系アプリでの課題となっていました。これを背景にWebSocketが開発されました。

WebSocketを学ぶ上でつまづくポイント

WebSocketを学ぶ際、多くの人が「HTTPとどう違うのか」「接続はどう維持されるのか」に戸惑います。HTTPはリクエストごとに接続を開閉するのに対し、WebSocketは接続を維持し続けます。この常時接続の概念が馴染みにくい点がつまづきやすいポイントです。また、ファイアウォールやプロキシ設定の違いにも注意が必要です。

WebSocketの構造

WebSocketは、最初にHTTPプロトコルで接続を確立した後、"Upgrade"ヘッダーでWebSocketプロトコルへ切り替えます。一度確立されると、クライアントとサーバー間でフレームと呼ばれる単位で双方向通信が行われ、TCP接続が維持され続けます。

sequenceDiagram participant Client as クライアント participant Server as サーバー Client->>Server: HTTP接続要求 (Upgrade: websocket) Server->>Client: 接続承認 loop 通信継続 Client->>Server: データ送信 (フレーム) Server->>Client: データ送信 (フレーム) end note over Client,Server: TCP接続は常時維持

WebSocketを利用する場面

WebSocketは、リアルタイム性が求められるアプリケーションで多く活用されています。

利用するケース1

オンラインゲームでは、プレイヤー間の位置情報やアクションを瞬時に共有する必要があります。WebSocketを使うことで、プレイヤーの動きが遅延なく他のユーザーに反映され、スムーズなゲーム体験が実現します。また、大量の同時接続を効率よく処理できる点でも重宝されています。

sequenceDiagram participant Player1 as プレイヤー1 participant Server as ゲームサーバー participant Player2 as プレイヤー2 Player1->>Server: 位置情報送信 Server->>Player2: 位置情報配信 loop ゲーム継続 Player2->>Server: アクション送信 Server->>Player1: アクション反映 end

利用するケース2

カスタマーサポートのチャットボットも、WebSocketを活用しています。ユーザーの質問に対し即座にサーバーとやり取りし、リアルタイムで回答を返します。これにより、ユーザーはストレスなくスムーズに問題解決へと導かれます。

sequenceDiagram participant User as ユーザー participant Bot as チャットボット participant Server as FAQサーバー User->>Bot: 質問入力 Bot->>Server: WebSocketで問い合わせ Server->>Bot: 回答データ返却 Bot->>User: 回答表示

さらに賢くなる豆知識

WebSocketはセキュリティにも配慮されており、wss:// というSSL/TLS暗号化通信にも対応しています。通常のws://と異なり、安全性が求められる金融取引や個人情報を扱うアプリケーションでも安心して使えます。

あわせてこれも押さえよう！

WebSocketの理解において、あわせて学ぶ必要があるサーバー技術を5つ紹介し、それぞれを簡単に説明します。

HTTP/2

HTTP/2は、従来のHTTP通信の高速化を目的としたプロトコルで、多重化やヘッダー圧縮が特徴です。

REST API

REST APIは、HTTPをベースにしたAPI設計手法で、シンプルなリクエスト・レスポンス形式が特徴です。

gRPC

gRPCは、Googleが開発した高速・軽量なリモートプロシージャコールの仕組みで、主にマイクロサービス間通信に使われます。

Socket.IO

Socket.IOは、WebSocketをラップし、さらに接続切断時の再接続機能やイベント管理を容易にするライブラリです。

MQTT

MQTTは、IoT分野でよく使われる軽量メッセージングプロトコルで、省電力かつ低帯域でも通信できます。

まとめ

WebSocketを理解することで、リアルタイム性が求められる現代のWebアプリケーション開発に役立ちます。効率的でスムーズな通信を実現でき、ユーザー体験の向上や業務の自動化にも貢献します。