美文网首页
1.15.1 关于取消axios请求

1.15.1 关于取消axios请求

作者: flyjar | 来源:发表于2023-06-08 08:26 被阅读0次

    axios 是如何取消请求的?

    目前最新的 axios 的取消请求api,推荐使用 AbortController 。旧版本的 CancelToken 在 v0.22.0 后弃用。

    重点:手动取消的请求,即使请求已经到了服务端,服务端的请求也是无法响应到前端了

    1、CancelToken方案
    const CancelToken = axios.CancelToken;
    const source = CancelToken.source();
    
    axios.get('/user/get', {
      cancelToken: source.token
    }).catch(function (thrown) {
     //手动取消之后,会触发catch,isCancel为true时,代表是手动取消的
      if (axios.isCancel(thrown)) {
        console.log('Request canceled', thrown.message);
      } else {
        // handle error
      }
    });
    
    axios.post('/user/12345', {
      name: 'new name'
    }, {
      cancelToken: source.token
    })
    
    // 执行此函数取消请求
    source.cancel('Operation canceled by the user.');
    
    
    2、AbortController方案
    const controller = new AbortController();
    
    axios.get('/foo/bar', {
       signal: controller.signal
    }).then(function(response) {
       //...
    //手动取消也是会触发catch的
    }).catch(function(){
    
    });
    // 取消本次请求
    controller.abort()
    
    

    相关文章

      网友评论

          本文标题:1.15.1 关于取消axios请求

          本文链接:https://www.haomeiwen.com/subject/pcnoedtx.html