请求取消 abort()

原生XMLHttpRequest

如果该请求已被发出，XMLHttpRequest.abort() 方法将终止该请求。当一个请求被终止，它的 readyState

将被置为 XMLHttpRequest.UNSENT (0)，并且请求的 status 置为 0。

var xhr = new XMLHttpRequest(),
  method = "GET",
  url = "https://developer.mozilla.org/";
xhr.open(method, url, true);

xhr.send();

if (OH_NOES_WE_NEED_TO_CANCEL_RIGHT_NOW_OR_ELSE) {
  xhr.abort();
}

AbortController

AbortController 接口表示一个控制器对象，允许你根据需要中止一个或多个 Web 请求。

你可以使用 AbortController.AbortController() 构造函数创建一个新的 AbortController。使用 AbortSignal 对象可以完成与 DOM 请求的通信。

具体请点击

使用axios

const controller = new AbortController();

axios.get('/foo/bar', {
   signal: controller.signal
}).then(function(response) {
   //...
});
// 取消请求
controller.abort()

使用场景：文本框输入推荐

let controller 
input.oninput = async()=>{
    // 每次输入框中输入后都去取消上一次请求
    controller && controller.abort() 
    // 重新创建一个控制器
    controller = new AbortController();

    axios.get('/getData', key , {
       signal: controller.signal
    }).then(function(response) {
       //...
    });
}