WebSocketとは何ですか？

ブラウザとサーバー間で双方向リアルタイム通信を行うプロトコル。チャットやリアルタイム更新に使われる。

WebSocketのポイントは？

HTTPとは異なり、コネクションを張りっぱなしで双方向通信。チャット、リアルタイム通知、ゲーム、株価表示に活用。ws://（非暗号化）と wss://（暗号化）の2つのスキーム。Socket.IO はWebSocketを簡単に使えるライブラリ

【うぇぶそけっと】

WebSocket とは？

💡 サーバーからもブラウザに「プッシュ通知」できる双方向通信

📌 このページのポイント

HTTPとは異なり、コネクションを張りっぱなしで双方向通信
チャット、リアルタイム通知、ゲーム、株価表示に活用
ws://（非暗号化）と wss://（暗号化）の2つのスキーム
Socket.IO はWebSocketを簡単に使えるライブラリ

HTTPは毎回リクエスト/レスポンス、WebSocketは一度つないだら双方向通信

ひよこ

HTTPとの違いは？

ペンギン先生

HTTPは「リクエスト→レスポンス」の一方通行で、ブラウザが聞かないとサーバーは答えられない。WebSocketは一度接続すれば、サーバーからブラウザにいつでもデータを送れる双方向通信。チャットアプリで「相手のメッセージがリアルタイムに表示される」のはWebSocketのおかげだよ

ひよこ

どんな場面で使うの？

ペンギン先生

①チャットアプリ（Slack、Discord）、②リアルタイム通知（SNSの「いいね」通知）、③株価・仮想通貨の価格表示、④オンラインゲーム、⑤共同編集（Google ドキュメント）。「データが変わったらすぐにブラウザに反映したい」場面がWebSocketの出番だよ

ひよこ

Server-Sent Events（SSE）との違いは？

ペンギン先生

SSEはサーバー→クライアントの一方向通知のみ。WebSocketは双方向。SSEはHTTP上で動くからプロキシやロードバランサーとの相性が良い。「サーバーからのプッシュだけでいい」場合はSSEの方がシンプル。ChatGPTのストリーミング表示にもSSEが使われているよ

ひよこ

WebSocketの注意点は？

ペンギン先生

①コネクション数の管理（サーバーリソースを消費し続ける）、②再接続ロジック（ネットワーク切断時の自動復帰）、③ロードバランサーとの相性（スティッキーセッションが必要）、④認証（接続時にJWTで認証、コネクション中の権限変更は別途対応）。Socket.IOを使えばこれらの課題を自動的にハンドリングしてくれるよ

まとめ：ざっくりこれだけ覚えればOK！

「WebSocket」って出てきたら「ブラウザとサーバーのリアルタイム双方向通信」と思えればだいたいOK！

📖 おまけ：英語の意味

「WebSocket」＝ウェブソケット

💬 Web上のSocket（通信口）。HTTPの一方通行を超えて双方向に会話できるよ

← 用語集にもどる