--- title: ReadableStream.getReader() slug: Web/API/ReadableStream/getReader tags: - API - getReader - 参考 - 可读取流 - 方法 - 流 translation_of: Web/API/ReadableStream/getReader ---
{{APIRef("Streams")}}

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

语法

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

参数

{mode}- 可选参数
具有 mode参数的对象,值为  {{domxref("DOMString")}}类型 ,用来指定要创建的阅读器的类型。其值可以是:

返回值

{{domxref("ReadableStreamDefaultReader")}} 类型或{{domxref("ReadableStreamBYOBReader")}} 类型 实例, 取决于 mode 值.

错误

RangeError——范围错误
提供的 mode值 既不是 byob也不是  undefined
TypeError——类型错误
尝试创建阅读器的流不是 {{domxref("ReadableStream")}}类型

例子

下面是个简单的例子, 在读取ReadableStream前,使用 getReader()创建一个{{domxref("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);
  });
}

说明

Specification Status(状态) Comment(备注)
{{SpecName("Streams","#rs-get-reader","getReader()")}} {{Spec2('Streams')}} Initial definition.

浏览器兼容

{{Compat("api.ReadableStream.getReader")}}