ReadableStream.getReader() - Web API 接口参考 编辑

使用ReadableStream接口的getReader() 方法创建一个reader，并将流锁定。只有当前reader将流释放后，其他reader才能使用。

语法

var reader = readableStreamInstance.getReader({mode});

参数

{mode}- 可选参数

具有 mode参数的对象，值为  DOMString类型 ,用来指定要创建的阅读器的类型。其值可以是：

• byob, 结果为 ReadableStreamBYOBReader 类型，可读取可读字节流。
• undefined (未定类型 — 默认值), 返回ReadableStreamDefaultReader ，可以从流中返回单个块。

返回值

ReadableStreamDefaultReader 类型或ReadableStreamBYOBReader 类型 实例, 取决于 mode 值.

错误

RangeError——范围错误

提供的 mode值 既不是 byob也不是  undefined

TypeError——类型错误

尝试创建阅读器的流不是 ReadableStream类型

例子

下面是个简单的例子, 在读取ReadableStream前，使用 getReader()创建一个ReadableStreamDefaultReader 。(查看全部代码 Simple random stream example ). 按顺序读取每个块，并传递给UI, 当整个流被读取完毕后, 从递归方法中退出，并在UI的另一部分输出整个流。

function fetchStream() {
  const reader = stream.getReader();
  let charsReceived = 0;

  // read() 返回了一个promise
  // 当数据被接收时resolve
  reader.read().then(function processText({ done, value }) {
    // Result对象包含了两个属性:
    // done  - 当stream传完所有数据时则变成true
    // value - 数据片段。当done不为true时永远为undefined
    if (done) {
      console.log("Stream complete");
      para.textContent = value;
      return;
    }

    // value for fetch streams is a Uint8Array
    charsReceived += value.length;
    const chunk = value;
    let listItem = document.createElement('li');
    listItem.textContent = 'Received ' + charsReceived + ' characters so far. Current chunk = ' + chunk;
    list2.appendChild(listItem);

    result += chunk;

    // 再次调用这个函数以读取更多数据
    return reader.read().then(processText);
  });
}

说明

浏览器兼容

BCD tables only load in the browser

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.