WebTransport URLテンプレートヘルパーとは
WebTransportは、HTTP/3（QUIC）上に構築されたブラウザAPIで、多重化された双方向ストリームと信頼性のないデータグラムをサポートする低遅延のクライアントサーバー通信を可能にします。単一の順序付けられたメッセージストリームを使用するWebSocketとは異なり、WebTransportは単一のQUIC接続上で複数の独立したストリームを並行して許可するため、信頼性と低遅延のベストエフォート配信の両方を必要とするアプリケーションに適しています。このAPIはURLテンプレートを使用して接続を確立し、開発用の自己署名証明書をserverCertificateHashesオプションでサポートしています。
クイックアンサー
HTTP/3（QUIC）通信用のJavaScript WebTransport接続スニペットを生成します。WebTransportは、単一の接続で多重化された双方向ストリームと信頼性のないデータグラムをサポートし、クライアントサーバーリアルタイムアプリ向けにWebSocketとWebRTCデータチャネルを置き換えます。Chrome 97+、Edge 97+、Safari 18.2+。
Last updated: 2026-06-03
制限事項
- WebTransportにはサーバー側のHTTP/3（QUIC）サポートが必要です。標準のHTTP/1.1およびHTTP/2サーバーはWebTransport接続を受け入れられません。これにより、専用のQUICサポートがあるサーバーへのデプロイが制限されます（QUICパッチ付きnginx、@fails-components/webtransport付きnode、またはクラウドプラットフォーム）。
- Firefoxは2026年初頭の時点でWebTransportをサポートしていません。クロスブラウザのリアルタイム通信が必要なアプリケーションは、Firefoxユーザー向けにWebSocketまたはWebRTCフォールバックを実装する必要があり、開発とテストのオーバーヘッドが増加します。
- WebTransport接続は、QUICまたはUDPをサポートしない企業ファイアウォールやプロキシサーバーによってブロックされる可能性があります。制限されたネットワーク環境では、信頼性のある接続のためにTCP上のWebSocketにフォールバックしてください。
Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub
使い方
- https://スキームとサーバーホストおよびポートを使用してWebTransportサーバーURLを入力します。たとえば、https://example.com:4433のように、HTTP/3（QUIC）エンドポイントを指定します。
- 生成されたスニペットに含めるトランスポート機能を選択します。双方向ストリーム、データグラム、またはその両方。
- オプションで、serverCertificateHashesオプションに証明書のSHA-256ハッシュを提供して、開発サーバーの自己署名証明書サポートを有効にします。
- 生成されたJavaScriptスニペットをコピーしてアプリケーションに統合します。スニペットには、接続確立、ストリーム開始、データグラム送受信、接続終了処理が含まれています。
主な用途
- ゲーム状態の同期には信頼性のあるストリームを、位置情報の更新には信頼性のないデータグラムを使用するリアルタイムマルチプレイヤーゲームを構築します。
- 各ドキュメントセクションが独自の双方向チャネルでストリーミングされるライブ共同ドキュメントエディタを作成し、WebSocketのヘッドオブブロッキングを回避します。
- 配信レイテンシよりも時折のパケット損失が許容される高頻度センサーまたは市場データを信頼性のないデータグラムを使用してストリーミングします。