在此页

• 句法
• 范例
• 规范
• 浏览器兼容性
• 相关话题

cancel() 方法在 ReadableStream interface cancels the associated stream. The supplied reason parameter will be given to the underlying source, which may or may not use it.

Cancel is used when you've completely finished with the stream and don't need any more data from it, even if there are chunks enqueued waiting to be read. That data is lost after cancel is called, and the stream is not readable any more. To read those chunks still and not completely get rid of the stream, you'd use ReadableStreamDefaultController.close() .

句法

var promise = readableStream.cancel(reason);
					

参数

reason

DOMString providing a human-readable reason for the cancellation.

返回值

A Promise , which fulfills with the value given in the reason 参数。

异常

TypeError

The stream you are trying to cancel is not a ReadableStream , or it is locked.

范例

In Jake Archibald's cancelling a fetch example, a stream is used to fetch the WHATWG HTML spec chunk by chunk; each chunk is searched for the string "service workers". When the search terms is found, cancel() is used to cancel the stream — the job is finished so it is no longer needed.

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…');
    }
    // keep reading
    return reader.read().then(process);
  });
}).catch(err => {
  console.log("Something went wrong. See devtools for details. Does the response lack CORS headers?");
  throw err;
});
					

规范

规范	状态	注释
流 The definition of 'cancel()' in that specification.	实时标准	初始定义。

浏览器兼容性

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.

更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
cancel	Chrome 43	Edge 14	Firefox 65 65 57 Disabled Disabled From version 57: this feature is behind the dom.streams.enabled preference (needs to be set to true ) 和 preference (needs to be set to ). To change preferences in Firefox, visit about:config.	IE No	Opera 30	Safari 10.1	WebView Android 43	Chrome Android 43	Firefox Android 65 65 57 Disabled Disabled From version 57: this feature is behind the dom.streams.enabled preference (needs to be set to true ) 和 preference (needs to be set to ). To change preferences in Firefox, visit about:config.	Opera Android 30	Safari iOS 10.3	Samsung Internet Android 4.0

图例

完整支持

完整支持

不支持

不支持

实验。期望将来行为有所改变。

实验。期望将来行为有所改变。

用户必须明确启用此特征。

用户必须明确启用此特征。

元数据

• 最后修改： Jan 3, 2020

相关话题

1. Streams API
2. ReadableStream
3. 构造函数

   1. ReadableStream()
4. 特性

   1. locked
5. 方法

   1. cancel()
   2. getReader()
   3. pipeThrough()
   4. pipeTo()
   5. tee()
6. Related pages for Streams

   1. Body.body
   2. ByteLengthQueuingStrategy
   3. CountQueuingStrategy
   4. ReadableByteStreamController
   5. ReadableStreamBYOBReader
   6. ReadableStreamBYOBRequest
   7. ReadableStreamDefaultController
   8. ReadableStreamDefaultReader
   9. WindowOrWorkerGlobalScope.fetch()
   10. WritableStream
   11. WritableStreamDefaultController
   12. WritableStreamDefaultWriter