WritableStream：close() 方法

Baseline 已广泛支持

此功能已成熟，并可在许多设备和浏览器版本上使用。自 2022 年 5 月以来，它已在各个浏览器中可用。

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

WritableStream 接口的 close() 方法关闭关联的流。在此方法调用之前写入的所有块都将在返回的 Promise 履行之前发送。

这等同于使用 getWriter() 获取 WritableStreamDefaultWriter，然后调用其 close() 方法。

语法

close()

返回值

如果所有剩余块在关闭之前成功写入，则 Promise 履行并返回 undefined；如果在过程中遇到问题，则 Promise 拒绝并返回一个错误。

以下示例展示了 WritableStream 的几个特性。它展示了使用自定义接收器和 API 提供的排队策略创建 WritableStream。然后它调用一个名为 sendMessage() 的函数，传入新创建的流和一个字符串。在这个函数内部，它调用流的 getWriter() 方法，该方法返回一个 WritableStreamDefaultWriter 实例。使用 forEach() 调用将字符串的每个块写入流中。最后，write() 和 close() 返回 Promise，这些 Promise 用于处理块和流的成功或失败。请注意，为了能够在流本身上调用 close()，必须使用 defaultWriter.releaseLock(); 断开写入器。

<ul id="log"></ul>

const list = document.getElementById("log");
function log(message) {
  const listItem = document.createElement("li");
  listItem.textContent = message;
  list.appendChild(listItem);
}

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);
      })
      .catch((err) => {
        log("Chunk error:", err);
      });
  });

  // Call ready again to ensure that all chunks are written
  //   before closing the writer.
  defaultWriter.ready
    .then(() => {
      defaultWriter.releaseLock();
      writableStream.close();
    })
    .then(() => {
      log("All chunks written / stream closed.");
    })
    .catch((err) => {
      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");
        result += decoded;
        resolve();
      });
    },
    close() {
      const listItem = document.createElement("li");
      log(`[MESSAGE RECEIVED] ${result}`);
    },
    abort(err) {
      log("Sink error:", err);
    },
  },
  queuingStrategy,
);

log("Sending 'Hello, world.' message.");
sendMessage("Hello, world.", writableStream);