AXIOS超時取消請求

2021-09-25 10:00:21 字數 726 閱讀 4967

今天發現專案在網路不好的時候發出請求會一直使頁面處於等待狀態,十分不友好。所以我在發出請求的函式中增加了取消axios請求的方法。

設定如下

//axios外

const canceltoken = axios.canceltoken;

let cancel;

//axios內

/**設定canceltoken 提前結束axios請求 通過cancel()呼叫*/

canceltoken: new canceltoken(function executor(c) ),

//通過cancel();觸發

通過這些就可以用來實現超時取消axios,只需要在發出請求前呼叫settimeout觸發cancel()並取消等待狀態圖即可。

let timer =

settimeout(() => );

this.show_why_err();

this.$spin.hide();

is_cancel = true;

}, 5000);

這樣的請求會觸發catch方法中的函式,判斷catch的err引數即可,為"cancel"則不觸發catch中的方法即可

不過這種寫法會有乙個問題,如果是增刪改操作,可能伺服器已經做出的操作,而還沒有返回響應,此時同樣會觸發超時。暫時是以警報的形式提醒別人注意。有更好的方法以後會更新。

axios取消請求

let btns document.getelementsbytagname btn let cancel null btns 0 onclick function axios then response axios.get adata then ret query方式傳參和接收引數 傳參 this...

Axios取消請求ajax請求

使用者需要快速請求,比如搶購,前一次的請求資料是毫無意義的,直接取消就完事了 快速切換tab等操作選單後,如果前一次請求比後一次請求響應慢,資料就會對不上 index.js 如果前一次請求還未響應,先取消 this cancel this cancel message this axios main...

axios 主動取消請求

已經傳送的請求,在沒有收到後台返回之前主動取消。這樣的場景很常用。例如 乙個支付元件,正在支付的時候使用者立即又關閉了元件,這時應該立即取消支付請求。又或者tabs切換的時候,都是經常用到的。這裡我是用typescript來封裝的乙個簡單的axios請求做演示。api.js import axios...