WebSocket API (WebSockets)

WebSocket API は、ユーザーのブラウザーとサーバー間で対話的な通信セッションを開くことができるものです。この API を使用すると、サーバーにメッセージを送信し、サーバーから返信をポーリングすることなく応答を受信することができます。

WebSocket API は、ウェブソケット接続を作成して使用するための、WebSocket インターフェイスと WebSocketStream インターフェイスという 2 つの異なるメカニズムを提供しています。

  • WebSocket インターフェイスは安定しており、ブラウザーとサーバーの対応も充実しています。しかし、背圧には対応していません。そのため、アプリケーションがメッセージを処理するよりも速いペースでメッセージが到着すると、メッセージをバッファーに保存することで端末のメモリーがいっぱいになったり、CPU 使用率が 100% になって応答不能になったり、あるいはその両方が起こります。
  • WebSocketStream インターフェイスは、WebSocketプロミスベースの別バージョンです。ストリーム API を使用してメッセージの送受信を処理し、ソケット接続がストリームの背圧を自動的に利用できます。つまり、アプリケーションのボトルネックを避けるために読み取りまたは書き込みの速度を調整できます。しかし、WebSocketStream は標準化されておらず、現在、1 つのレンダリングエンジンしか対応していません。

それに加えて、WebTransport API が多くのアプリケーションで WebSocket API に取って代わることも予想されます。WebTransport は、汎用性の高い低レベル API で、背圧や、WebSocketWebSocketStream では対応していない機能、例えば、一方向ストリーム、順不同配信、データグラムを介した信頼性の低いデータ転送など、他にも多くの機能を提供します。WebTransport は WebSocket よりも複雑で、ブラウザーの対応も限定的ですが、高度なソリューションの実装が可能です。標準の WebSocket 接続が用途に適しており、幅広いブラウザーとの互換性が必要な場合は、WebSockets API を用いてすばやく実装し、実行することができます。しかし、アプリケーションに標準以外のカスタムソリューションが要求される場合は、WebTransport API を使用すべきでしょう。

メモ: WebSocket の接続は機能的にどこか標準 Unix スタイルのソケットに似ていますが、関連はありません。

インターフェイス

WebSocket

WebSocket サーバーに接続し、その接続を通じてデータを送受信するための主要インターフェイス

WebSocketStream 非標準

WebSocket サーバーに接続するためのプロミスベースのインターフェイス。ストリームを使用して接続上のデータの送受信を行います。

CloseEvent

接続が閉じた時に WebSocket オブジェクトによって送信されるイベントです。

MessageEvent

サーバーからメッセージを受信した時に WebSocket オブジェクトによって送信されるイベント

関連 HTTP ヘッダー

WebSocket のハンドシェイクでは、HTTP ヘッダーが使用されます。

Sec-WebSocket-Key

クライアントからのノンスを保持する HTTP リクエストヘッダー。 これは、WebSocket 開始時のハンドシェイクで使用され、クライアントが明示的に WebSocket を開く意図があることを確認します。 ブラウザーによって自動的に追加されます。 ブラウザーによって自動的に追加されます。

Sec-WebSocket-Accept

WebSocket の開くためのハンドシェイクで使用する HTTP レスポンスヘッダーで、サーバーが WebSocket 接続へのアップグレードを望んでいることを示します。 ディレクティブの値は、対応するリクエストの Sec-WebSocket-Key の値から計算されます。

Sec-WebSocket-Version

リクエストで、クライアントが理解する WebSocket プロトコルのバージョンを示す HTTP ヘッダー。 レスポンスでは、リクエストされたプロトコルバージョンがサーバーで対応していない場合にのみ送信され、サーバーが対応しているバージョンが掲載されています。

Sec-WebSocket-Protocol

リクエストでは、クライアントが対応しているサブプロトコルを推奨する順番で示す HTTP ヘッダーです。 レスポンスでは、サーバーがクライアントの環境設定から選択したサブプロトコルを示します。

Sec-WebSocket-Extensions

リクエストでは、クライアントが対応している WebSocket 拡張機能を推奨する順番で示す HTTP ヘッダーです。 レスポンスでは、サーバーがクライアントの環境設定から選択した拡張機能です。

ガイド

ツール

  • AsyncAPI: WebSocket のようなプロトコルに基づいたイベントドリブン型アーキテクチャを記述するための仕様です。 OpenAPI 仕様で REST API を記述するのと同じように、 WebSocket ベースの API を記述するために使用することができます。 WebSocket で AsyncAPI の利用を検討すべき理由利用する方法を紹介します。
  • µWebSockets: C++11 および Node.js で書かれた可用性の高い WebSocket サーバーとクライアントの実装です。
  • Socket.IO: 長いポーリングと WebSocket ベースのサードバーティ―の Node.js 用転送プロトコルです。
  • SocketCluster: スケーラビリティに焦点を当てた Node.js 用の pub/sub WebSocket フレームワークです。
  • WebSocket-Node: Node.js 用の WebSocket サーバー API 実装です。
  • Total.js: Node.js 用の ウェブアプリケーションフレームワーク(使用例: WebSocket chat)
  • SignalR: SignalR は単一のコードだけで、もし WebSockets が使用可能な場合、基盤として WebSockets を使用し、そうでない場合はほかの代替技術にフォールバックします。
  • Caddy: WebSocket として任意のコマンド (stdin/stdout) を中継することができるウェブサーバーです。
  • ws: Node.js のための有名な WebSocket クライアント&サーバーライブラリーです。
  • cowboy: Cowboy は高速で最新の HTTP サーバーで、 Erlang/OTP のためのものであり、 WebSocket に対応しています。
  • ZeroMQ: ZeroMQ は、インプロセス、IPC、TCP、UDP、TIPC、マルチキャスト、WebSocket でメッセージを伝送する組み込み可能なネットワーキングライブラリーです。
  • WebSocket King: WebSocket サーバーの開発、テスト、作業を支援するクライアントツールです。
  • PHP WebSocket Server: WebSocket の wss:// または ws:// および通常ソケットの ssl://, tcp:// を介して接続を処理するために PHP で書かれたサーバーです。
  • Django Channels: WebSocket(および長時間動作する非同期接続を必要とする他のプロトコル)の対応を追加する Django ライブラリーです。
  • (Phoenix) Channels: Elixir Phoenix フレームワークで WebSocket を使用したスケーラブルなリアルタイム通信です。
  • Phoenix LiveView: Elixir Phoenix フレームワークで WebSocket によるリアルタイムの対話型ウェブ体験です。
  • Flask-SocketIO: Flask アプリケーションに、クライアントとサーバー間の低遅延な双方向通信を提供します。
  • Gorilla WebSocket: Gorilla WebSocket は、WebSocket プロトコルの Go による実装です。

仕様書

Specification
WebSockets
# the-websocket-interface

ブラウザーの互換性

api.WebSocket

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
WebSocket
WebSocket() constructor
url parameter allows https, http, and relative URLs
binaryType
bufferedAmount
close
close event
error event
extensions
message event
open event
protocol
Supports protocol as specified by RFC 6455
readyState
send
url
Available in workers

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
See implementation notes.
Requires a vendor prefix or different name for use.
Has more compatibility info.

api.WebSocketStream

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
WebSocketStream
Experimental
WebSocketStream() constructor
Experimental
close
Experimental
closed
Experimental
opened
Experimental
url
Experimental

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Experimental. Expect behavior to change in the future.

関連情報