此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。
ReadableStream.getReader()
ReadableStream 接口的 getReader() 方法会创建一个 reader,并将流锁定。只有当前 reader 将流释放后,其他 reader 才能使用。
语法
js
getReader()
getReader(mode)
参数
mode可选-
具有
mode参数的对象,值为String类型,用来指定要创建的 reader 的类型。其值可以是:"byob",结果为ReadableStreamBYOBReader类型,可读取可读字节流。undefined(或不指定——缺省值),返回ReadableStreamDefaultReader,可以从流中返回单个分块。
返回值
ReadableStreamDefaultReader 类型或 ReadableStreamBYOBReader 类型的实例,取决于 mode 值。
异常
RangeError-
提供的 mode 值既不是
"byob"也不是undefined。 TypeError-
尝试创建 reader 的流不是
ReadableStream类型。
示例
下面是个简单的例子,在读取 ReadableStream 前,使用 getReader() 创建一个 ReadableStreamDefaultReader。(查看全部代码:Simple random stream example)。按顺序读取每个分块,并传递给 UI,当整个流被读取完毕后,从递归方法中退出,并在 UI 的另一部分输出整个流。
js
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);
});
}
规范
| 规范 |
|---|
| Streams # ref-for-rs-get-reader5 |
浏览器兼容性
启用 JavaScript 以查看此浏览器兼容性表。