ReadableStream.cancel()
ReadableStream
接口的 cancel()
方法返回一个 Promise
,这个 promise 会在流被取消的时候兑现。
cancel 用于在不再需要来自它的任何数据的情况下(即使仍有排队等待的数据块)完全结束一个流。调用 cancel 后该数据丢失,并且流不再可读。为了仍然可以读这些数据块而不完全结束这个流,你应该使用 ReadableStreamDefaultController.close()
。
语法
js
cancel()
cancel(reason)
参数
reason
可选-
人类可读的取消原因。底层源代码可能会使用它。
返回值
一个 Promise
,会在结束时使用给定的 reason
参数兑现。
异常
TypeError
-
它尝试取消的流不是
ReadableStream
,或者它已被锁定。
示例
在 Jake Archibald 的取消一个 fetch 示例中,流用于逐块获取 WHATWG HTML 规范;并在每个块中搜索“service workers”字符串。当找到搜索词时,使用 cancel()
取消流——作业已被完成,因此不再需要它。
js
var searchTerm = "service workers";
// Chars to show either side of the result in the match
var contextBefore = 30;
var contextAfter = 30;
var caseInsensitive = true;
var url = "https://html.spec.whatwg.org/";
console.log(`Searching '${url}' for '${searchTerm}'`);
fetch(url)
.then((response) => {
console.log("Received headers");
var decoder = new TextDecoder();
var reader = response.body.getReader();
var toMatch = caseInsensitive ? searchTerm.toLowerCase() : searchTerm;
var bufferSize = Math.max(toMatch.length - 1, contextBefore);
var bytesReceived = 0;
var buffer = "";
var matchFoundAt = -1;
return reader.read().then(function process(result) {
if (result.done) {
console.log("Failed to find match");
return;
}
bytesReceived += result.value.length;
console.log(`Received ${bytesReceived} bytes of data so far`);
buffer += decoder.decode(result.value, { stream: true });
// already found match & just context-gathering?
if (matchFoundAt === -1) {
matchFoundAt = (
caseInsensitive ? buffer.toLowerCase() : buffer
).indexOf(toMatch);
}
if (matchFoundAt === -1) {
buffer = buffer.slice(-bufferSize);
} else if (
buffer.slice(matchFoundAt + toMatch.length).length >= contextAfter
) {
console.log("Here's the match:");
console.log(
buffer.slice(
Math.max(0, matchFoundAt - contextBefore),
matchFoundAt + toMatch.length + contextAfter,
),
);
console.log("Cancelling fetch");
reader.cancel();
return;
} else {
console.log("Found match, but need more context…");
}
// 保持读取
return reader.read().then(process);
});
})
.catch((err) => {
console.log(
"Something went wrong. See devtools for details. Does the response lack CORS headers?",
);
throw err;
});
规范
Specification |
---|
Streams Standard # ref-for-rs-cancel③ |
浏览器兼容性
BCD tables only load in the browser
参见
ReadableStream()
构造函数- 使用可读流