WebTransportBidirectionalStream

可用性有限

此特性不是基線特性，因為它在一些最廣泛使用的瀏覽器中不起作用。

安全上下文： 此功能僅在安全上下文（HTTPS）中可用，且支援此功能的瀏覽器數量有限。

注意：此功能在 Web Workers 中可用。

WebTransportBidirectionalStream 介面是 WebTransport API 的一部分，它代表由伺服器或客戶端建立的雙向流，可用於可靠傳輸。它提供了對 WebTransportReceiveStream 的訪問，用於讀取傳入資料，以及對 WebTransportSendStream 的訪問，用於寫入傳出資料。

例項屬性

readable 只讀: 返回一個 WebTransportReceiveStream 例項，可用於讀取傳入資料。
writable 只讀: 返回一個 WebTransportSendStream 例項，可用於寫入傳出資料。

要從使用者代理開啟雙向流，您可以使用 WebTransport.createBidirectionalStream() 方法獲取 WebTransportBidirectionalStream 的引用。readable 和 writable 屬性分別返回 WebTransportReceiveStream 和 WebTransportSendStream 例項的引用。它們分別繼承自 ReadableStream 和 WritableStream，可用於與伺服器進行讀取和寫入。

async function setUpBidirectional() {
  const stream = await transport.createBidirectionalStream();
  // stream is a WebTransportBidirectionalStream
  // stream.readable is a WebTransportReceiveStream
  const readable = stream.readable;
  // stream.writable is a WebTransportSendStream
  const writable = stream.writable;

  // …
}

從 WebTransportReceiveStream 讀取資料的方式與讀取 ReadableStream 的方式相同。

async function readData(readable) {
  const reader = readable.getReader();
  while (true) {
    const { value, done } = await reader.read();
    if (done) {
      break;
    }
    // value is a Uint8Array.
    console.log(value);
  }
}

向 WebTransportSendStream 寫入資料可以按如下方式完成：

async function writeData(writable) {
  const writer = writable.getWriter();
  const data1 = new Uint8Array([65, 66, 67]);
  const data2 = new Uint8Array([68, 69, 70]);
  writer.write(data1);
  writer.write(data2);
}

伺服器發起的雙向傳輸

如果伺服器開啟雙向流以向客戶端傳輸資料並從中接收資料，則可以透過 WebTransport.incomingBidirectionalStreams 屬性進行訪問，該屬性返回一個 WebTransportBidirectionalStream 物件的可讀流 (ReadableStream)。每個流都可以按上述方式用於讀取和寫入 Uint8Array 例項。但是，您需要一個初始函式來首先讀取雙向流。

async function receiveBidirectional() {
  const bds = transport.incomingBidirectionalStreams;
  const reader = bds.getReader();
  while (true) {
    const { done, value } = await reader.read();
    if (done) {
      break;
    }
    // value is an instance of WebTransportBidirectionalStream
    await readData(value.readable);
    await writeData(value.writable);
  }
}