如今,Fetch API已經成為現在瀏覽器非同步網路請求的標準方法,但Fetch也是有弊端的,比如: Fetch還沒有方法終止一個請求,而且Fetch無法檢測上傳進度 現在我們可以通過 AbortController 和 AbortSignal 來終止,代碼如下: const controller = ...
如今,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');
}
})