WebTransport

有限可用性

此功能不是基线，因为它在一些最广泛使用的浏览器中无法使用。

安全上下文：此功能仅在 安全上下文（HTTPS）中可用，在一些或所有 支持的浏览器 中。

注意：此功能在 网页工作线程 中可用。

WebTransport 接口是 WebTransport API 的一部分，它提供功能使用户代理能够连接到 HTTP/3 服务器，在任一或两个方向启动可靠和不可靠的传输，并在不再需要时关闭连接。

构造函数

WebTransport()

创建一个新的 WebTransport 对象实例。

实例属性

closed 只读

返回一个承诺，该承诺在传输关闭时解析。

datagrams 只读

返回一个 WebTransportDatagramDuplexStream 实例，可用于发送和接收数据报。

congestionControl 只读

返回一个字符串，该字符串指示发送数据时对高吞吐量或低延迟的应用程序首选项。

incomingBidirectionalStreams 只读

表示服务器打开的一个或多个双向流。返回 ReadableStream 的 WebTransportBidirectionalStream 对象。每个对象都可用于从服务器读取数据并向服务器写入数据。

incomingUnidirectionalStreams 只读

表示服务器打开的一个或多个单向流。返回 ReadableStream 的 WebTransportReceiveStream 对象。每个对象都可用于从服务器读取数据。

ready 只读

返回一个承诺，该承诺在传输准备就绪可用时解析。

reliability 只读

返回一个字符串，该字符串指示连接是否仅支持可靠传输，或者是否也支持不可靠传输（例如 UDP）。

实例方法

close()

关闭正在进行的 WebTransport 会话。

createBidirectionalStream()

异步打开一个双向流 (WebTransportBidirectionalStream)，可用于从服务器读取数据并向服务器写入数据。

createUnidirectionalStream()

异步打开一个单向流 (WritableStream)，可用于向服务器写入数据。

getStats()

异步返回一个 Promise，该承诺在使用包含 HTTP/3 连接统计信息的对象时解析。

示例

下面的示例代码展示了如何通过将 HTTP/3 服务器的 URL 传递给 WebTransport() 构造函数来连接到服务器。请注意，方案需要是 HTTPS，并且需要明确指定端口号。一旦 WebTransport.ready 承诺解析，您就可以开始使用连接。

js
async function initTransport(url) {
  // Initialize transport connection
  const transport = new WebTransport(url);

  // The connection can be used once ready fulfills
  await transport.ready;
  return transport;
}

您可以通过等待 WebTransport.closed 承诺解析或拒绝来响应连接关闭。WebTransport 操作返回的错误类型为 WebTransportError，并且包含除了标准 DOMException 集合之外的附加数据。

下面的 closeTransport() 方法展示了可能的实现。在一个 try...catch 块中，它使用 await 来等待 closed 承诺解析或拒绝，然后报告连接是故意关闭还是由于错误而关闭。

js
async function closeTransport(transport) {
  // Respond to connection closing
  try {
    await transport.closed;
    console.log(`The HTTP/3 connection to ${url} closed gracefully.`);
  } catch (error) {
    console.error(`The HTTP/3 connection to ${url} closed due to ${error}.`);
  }
}

我们可能会在自己的异步函数中调用上面的异步函数，如下所示。

js
// Use the transport
async function useTransport(url) {
  const transport = await initTransport(url);

  // Use the transport object to send and receive data
  // ...

  // When done, close the transport
  await closeTransport(transport);
}

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

有关其他示例代码，请参阅各个属性和方法页面。

规范

规范
WebTransport
# web-transport

浏览器兼容性

BCD 表仅在浏览器中加载

另请参阅