WebTransport

Baseline 2026 *

コンストラクター

WebTransport(): 新しい WebTransport オブジェクトのインスタンスを作成します。

インスタンスプロパティ

closed 読取専用: トランスポートが閉じられたときに解決するプロミスを返します。
datagrams 読取専用: データグラムの送受信に使用できる WebTransportDatagramDuplexStream インスタンスを返します。
congestionControl 読取専用: データ送信時に、高スループットと低レイテンシーのどちらを推奨するかを示す文字列を返します。
incomingBidirectionalStreams 読取専用: サーバーによって開かれた 1 つ以上の双方向ストリームを表します。WebTransportBidirectionalStream オブジェクトの ReadableStream を返します。それぞれのオブジェクトを使用して、サーバーからデータを読み込んだり、サーバーにデータを書き戻したりすることができます。
incomingUnidirectionalStreams 読取専用: サーバーによって開かれた 1 つ以上の単方向ストリームを表します。WebTransportReceiveStream オブジェクトの ReadableStream を返します。それぞれのオブジェクトを使用して、サーバーからデータを読み取ることができます。
ready 読取専用: トランスポートが使用可能になった時点で解決するプロミスを返します。
reliability 読取専用: 接続が信頼性のあるトランスポートにのみ対応しているか、それとも信頼性のないトランスポート（UDP など）にも対応しているかを示す文字列を返します。

インスタンスメソッド

close(): 進行中のウェブトランスポートセッションが閉じられます。
createBidirectionalStream(): サーバーとの間でデータの読み書きを行うために使用できる双方向ストリーム (WebTransportBidirectionalStream) を非同期で開きます。
createUnidirectionalStream(): サーバーへの書き込みに使用できる単方向ストリーム (WritableStream) を非同期で開きます。
getStats(): 非同期で、HTTP/3 接続の統計情報を含むオブジェクトで履行される Promise を返します。

例

下記のサンプルコードは、WebTransport() コンストラクターに URL を渡すことで、HTTP/3 サーバーに接続する方法を示しています。なお、プロトコルは HTTPS である必要があり、ポート番号は明示的に指定する必要があります。 WebTransport.ready プロミスが履行されたら、接続を使用することができ0ます。

async function initTransport(url) {
  // トランスポートコネクションを初期化
  const transport = new WebTransport(url);

  // ready が履行されるとコネクションが利用できる
  await transport.ready;
  return transport;
}

接続の終了には、WebTransport.closed プロミスが履行されるのを待つことで応答できます。 WebTransport 操作によって返されるエラーは WebTransportError 型であり、標準の DOMException セットに加えて追加のデータが含まれています。

下記の closeTransport() メソッドは、その実装例を示しています。 try...catch ブロック内で await を使用し、closed プロミスが履行されるか拒否されるかを待ち、その後、接続が意図的に閉じられたのか、それともエラーによるものだったのかを報告します。

async function closeTransport(transport) {
  // コネクションが閉じるのに応答
  try {
    await transport.closed;
    console.log(`HTTP/3 による ${url} へのコネクションは正常に閉じられました。`);
  } catch (error) {
    console.error(`HTTP/3 による ${url} へのコネクションは ${error} で閉じられました。`);
  }
}

上記の非同期関数については、下記に示すように、自分自身で別の非同期関数内で呼び出すことができます。

// transport を使用
async function useTransport(url) {
  const transport = await initTransport(url);

  // transport オブジェクトを使用してデータを送受信
  // …

  // 終了したら、トランスポートを閉じる
  await closeTransport(transport);
}

const url = "https://example.com:4999/wt";
useTransport(url);

他のコード例については、各プロパティおよびメソッドのページを参照してください。