axios裏如何優雅的處理網絡超時

網絡超時的常見表現就是我們請求一個接口如果長時間得不到服務器的響應。就會出現網絡中斷,報錯提示網絡超時。

在前端項目中,我們一般通過axios的攔截器對後端的請求和響應進行統一處理。

網絡超時屬於返回異常的一種。因此我們需要在攔截器的response中對error進行處理:

我們首先設置axios的正常請求的timeouot爲4000ms,也就是4秒鐘如果得不到服務器響應就會中斷。

第二步:我們給後端接口設置一個大於4秒的延遲,比如10秒。也就是說10秒以後,財返回數據給前端。

本例中我們利用koa2作爲服務器:

接下來我們看看axios攔截器的response裏error到底是啥?

在控制檯我們會發現:

這個error其實下面有屬性:message:錯誤的文本信息,code。錯誤碼:

經打印發現:

error.code='ECONNABORTED',

error.message='Network Error'

因此我們可以通過判斷這兩個屬性得知道=是否超時,然後做出提示:

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章