AbortController取消Fetch请求和XMLHttpRequest

这个是一个实验性接口，注意兼容性。
使用过 fetch 请求数据时，如果一定时间未请求完成，可以使用 AbsortController 在前端取消该请求。

function isPrime(number, timeout = 2000) {
  const controller = new AbortController()
  // 调用其 absort 方法取消请求
  setTimeout(() => controller.abort(), timeout)
  // 调用由远程某个接口
  // 注意这里 fetch 传入的options
  fetch(`http://localhost:8081/isprime?number=${number}`, { signal: controller.signal })
    .then(res => res.json())
    .then(console.log)
    .catch(console.error)
}

还有应用场景是取消下载什么的,可以根据自己的需要使用。

参考链接:

• AbortController - MDN
• Aborting Fetch API Request - Hussein Youtube
• AbortableFetch.js - github
• fetch AbortController 掘金

相关文章：

• 原生JS实现XMLHttpRequest 、JSONP 、 Fetch 的封装和使用
  XMLHttpRequest的封装和调用（加入JSONP功能）
• Sending JavaScript Http Requests with XMLHttpRequest - academind youtube