fecth 如何取消请求?

13 min read

在使用Fetch发送请求时,可以通过调用AbortController的abort()方法来取消请求。

首先创建一个AbortController实例,并将该实例的signal属性作为fetch请求的signal参数传递:

const controller = new AbortController();

fetch(url, { signal: controller.signal })
  .then(response => {
    // 处理响应
  })
  .catch(error => {
    if (error.name === 'AbortError') {
      // 请求被取消
    } else {
      // 其他错误处理
    }
  });

然后,在需要取消请求的地方调用abort()方法:

controller.abort();

这将导致Promise被拒绝,并触发catch块,其中error的name属性为'AbortError'。