中断请求AbortController

「时光不负，创作不停，本文正在参加2022年中总结征文大赛」

axios中的请求中断

sendStr() {
      if(window.cancel) window.cancel()
      let CancelToken = axios.CancelToken;
      // let cancel
      axios
        .get(`http://localhost:3000/test?str=${this.searchStr}`, {
          cancelToken: new CancelToken(function executor(c) {
          window.cancel = c;
          })
        })
        .then(res => {
          console.log(res);
          window.cancel = null
        })
    }

fetch手动中断 fetch是一种原生HTTP数据请求的方式，是xml的替代方案，和axios类似同样使用了 [JavaScript Promises] 来处理结果/回调.

AbortController对象

AbortController接口代表一个控制器对象，允许你在需要时中止一个或多个Web(网络)请求。

 download() {
      this.downloadController = new AbortController();
      this.signal = this.downloadController.signal;
      fetch(`http://localhost:4200/test?str=${this.searchStr}`, {
        signal: this.signal
      })
        .then(res => {
         console.log(res);
        })
        .catch(err => {
         console.log(err);
        });
    },
    termination() {
      this.downloadController.abort();
    }