如今,Fetch API已經成為現在瀏覽器異步網絡請求的標准方法,但Fetch也是有弊端的,比如: Fetch還沒有方法終止一個請求,而且Fetch無法檢測上傳進度
現在我們可以通過 AbortController 和 AbortSignal 來終止,代碼如下:
const controller = new AbortController()
const signal = controller.signal
fetch('./data.json', { signal })
可以通過controller.abort()來通知終止事件,比如,你可以在請求發出后3秒來終止請求
setTimeout(() => { controller.abort(); }, 3 * 1000);
如果請求完成了,調用absort()不會發生錯誤
如果請求沒有完成,那么Fetch就會拋出一個DOMException異常,異常的name屬性值為"AbortError",可以在promise中的catch捕獲這個異常
例如: fetch('./data.json', { signal })
.then((res) => {})
.catch((err) => {
if (err.name === 'AbortError') {
console.log('Fetch aborted');
} else {
console.log('Another error');
}
})