FE AJAX 非同步請求中途取消

2022-06-12 20:45:10 字數 584 閱讀 8941

應用場景

當前端需要即時搜尋時,會不斷的向後端請求ajax,但是前端僅僅需要最後一次的搜尋結果,之前的請求全部丟棄。

示例對於未封裝原生的js來說

xhr.onreadystatechange = ()=>{} // **函式

xhr.send(); // 傳送請求

xhr.abort(); // 請求終端axios

let canceltoken = axios.canceltoken;

let source = conceltoken.source();

axios().then(res=>).catch(err=>);

source.cancel();

總結

配合取消請求可以優化減少搜尋請求,特別是當使用者不斷修改搜尋的時候。

axios封裝了promise,提供了canceltoken,與c# 的task非同步多執行緒的canceltoken相似。

axios取消請求

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

rn fetch blob redux 取消請求

其實取消請求對於普通的ajax請求rn fetch blob寫法是比較簡單的 1 let task rnfetchblob.fetch get 23 task.then 4 handle request cancelled rejection 5 catch err 8 cancel the req...

Axios取消請求ajax請求

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