--- title: ReadableStream.getReader() slug: Web/API/ReadableStream/getReader tags: - API - getReader - 参考 - 可读取流 - 方法 - 流 translation_of: Web/API/ReadableStream/getReader ---
使用{{domxref("ReadableStream")}}接口的getReader() 方法创建一个reader,并将流锁定。只有当前reader将流释放后,其他reader才能使用。
var reader = readableStreamInstance.getReader({mode});
mode参数的对象,值为 {{domxref("DOMString")}}类型 ,用来指定要创建的阅读器的类型。其值可以是:
byob, 结果为 {{domxref("ReadableStreamBYOBReader")}} 类型,可读取可读字节流。undefined (未定类型 — 默认值), 返回{{domxref("ReadableStreamDefaultReader")}} ,可以从流中返回单个块。{{domxref("ReadableStreamDefaultReader")}} 类型或{{domxref("ReadableStreamBYOBReader")}} 类型 实例, 取决于 mode 值.
下面是个简单的例子, 在读取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")}}