Back to Content

WritableStreamDefaultWriter: close() method

files/en-us/web/api/writablestreamdefaultwriter/close/index.md

latest3.4 KB
Original Source

{{APIRef("Streams")}}{{AvailableInWorkers}}

The close() method of the {{domxref("WritableStreamDefaultWriter")}} interface closes the associated writable stream.

The underlying sink will finish processing any previously-written chunks, before invoking the close behavior. During this time any further attempts to write will fail (without erroring the stream).

Syntax

js-nolint
close()

Parameters

None.

Return value

A {{jsxref("Promise")}}, which fulfills with the undefined if all remaining chunks were successfully written before the close, or rejects with an error if a problem was encountered during the process.

Exceptions

  • {{jsxref("TypeError")}}
    • : The stream you are trying to close is not a {{domxref("WritableStream")}}.

Examples

The following example shows the creation of a WritableStream with a custom sink and an API-supplied queuing strategy. It then calls a function called sendMessage(), passing the newly created stream and a string. Inside this function it calls the stream's getWriter() method, which returns an instance of {{domxref("WritableStreamDefaultWriter")}}. Each chunk of the encoded string is written to the stream using the write() method, and the forEach() method of the encoded Uint8Array to process it byte-by-byte. Finally, close() is called and the Promise it returns is handled to deal with success (or any failures) of the chunked write operations.

js
const list = document.querySelector("ul");

function sendMessage(message, writableStream) {
  // defaultWriter is of type WritableStreamDefaultWriter
  const defaultWriter = writableStream.getWriter();
  const encoder = new TextEncoder();
  const encoded = encoder.encode(message);
  encoded.forEach((chunk) => {
    defaultWriter.ready
      .then(() => {
        defaultWriter.write(chunk);
      })
      .then(() => {
        console.log("Chunk written to sink.");
      })
      .catch((err) => {
        console.log("Chunk error:", err);
      });
  });
  // Call ready again to ensure that all chunks are written
  //   before closing the writer.
  defaultWriter.ready
    .then(() => {
      defaultWriter.close();
    })
    .then(() => {
      console.log("All chunks written");
    })
    .catch((err) => {
      console.log("Stream error:", err);
    });
}

const decoder = new TextDecoder("utf-8");
const queuingStrategy = new CountQueuingStrategy({ highWaterMark: 1 });
let result = "";
const writableStream = new WritableStream(
  {
    // Implement the sink
    write(chunk) {
      return new Promise((resolve, reject) => {
        const buffer = new ArrayBuffer(1);
        const view = new Uint8Array(buffer);
        view[0] = chunk;
        const decoded = decoder.decode(view, { stream: true });
        const listItem = document.createElement("li");
        listItem.textContent = `Chunk decoded: ${decoded}`;
        list.appendChild(listItem);
        result += decoded;
        resolve();
      });
    },
    close() {
      const listItem = document.createElement("li");
      listItem.textContent = `[MESSAGE RECEIVED] ${result}`;
      list.appendChild(listItem);
    },
    abort(err) {
      console.log("Sink error:", err);
    },
  },
  queuingStrategy,
);

sendMessage("Hello, world.", writableStream);

You can view a live demonstration of this at our simple writer example.

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}