W3cubDocs

/Web APIs

WebTransport: createBidirectionalStream() method

The createBidirectionalStream() method of the WebTransport interface asynchronously opens and returns a bidirectional stream.

The method returns a Promise that resolves to a WebTransportBidirectionalStream object, which has readable and writable properties that can be used to reliably read from and write to the server. "Reliable" means that transmission and order of data are guaranteed. This provides slower delivery (albeit faster than with WebSockets) than datagrams, but is needed in situations where reliability and ordering are important, like chat applications.

The relative order in which queued bytes are emptied from created streams can be specified using the sendOrder option. If set, queued bytes in streams with a higher send order are guaranteed to be sent before queued bytes for streams with a lower send order. If the order number is not set then the order in which bytes are sent is implementation dependent. Note however that even though bytes from higher send-order streams are sent first, they may not arrive first.

Note: This feature is available in Web Workers

Syntax

js

createBidirectionalStream()
createBidirectionalStream(options)

Parameters

options Optional

An object that may have the following properties:

sendOrder Optional

A integer value specifying the send priority of this stream relative to other streams for which the value has been set. Queued bytes are sent first for streams that have a higher value. If not set, the send order depends on the implementation.

Return value

A Promise that resolves to a WebTransportBidirectionalStream object.

Exceptions

InvalidStateError DOMException

Thrown if createBidirectionalStream() is invoked while the WebTransport is closed or failed.

Examples

An initial function is used to get references to the WebTransportBidirectionalStream.readable and WebTransportBidirectionalStream.writable properties. These are references to ReadableStream and WritableStream instances, which can be used to read from and write to the server.

js

async function setUpBidirectional() {
  const stream = await transport.createBidirectionalStream({
    sendOrder: "596996858",
  });
  // stream is a WebTransportBidirectionalStream
  // stream.readable is a ReadableStream
  const readable = stream.readable;
  // stream.writable is a WritableStream
  const writable = stream.writable;

  // ...
}

Reading from the ReadableStream can then be done as follows:

js

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);
  }
}

And writing to the WritableStream can be done like this:

js

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);
}

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
createBidirectionalStream 97 97 114 No 83 No 97 97 114 68 No 18.0
options_sendOrder_parameter No No 119 No No No No No 119 No No No

See also

© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/WebTransport/createBidirectionalStream