fetch
是 JavaScript 原生內建的 API,用來發送網絡請求。它是較新版本的標準,為了取代舊的 XMLHttpRequest
而被引入。axios
則是一個第三方庫,專門用來進行網絡請求,基於 Promise 並且有一些更強大的功能和簡化操作的優點。
讓我們來比較一下 fetch
和 axios
,以及在不同情況下你可能會想用哪一個。
1. fetch
的優點
- 內建於瀏覽器中:
fetch
是瀏覽器內建的 API,這意味著它無需安裝任何第三方庫即可使用,這樣可以減少應用程式的依賴大小。 - Promise-based:
fetch
使用 Promise,因此語法簡潔且支持鏈式處理。 - 相對現代:
fetch
是為了解決XMLHttpRequest
的一些痛點設計的,例如更好的語法、更好地支持流處理(例如檔案下載)。
2. axios
的優點
- 更簡單的語法:
axios
提供了更簡單和一致的 API,例如自動解析 JSON 回應、錯誤處理,以及直接提供更多的功能。 - 更好的錯誤處理:
fetch
不會在 HTTP 請求出現 4xx 或 5xx 錯誤時自動拋出錯誤,而axios
會自動處理這些錯誤,使錯誤處理更直觀。 - 支持取消請求:
axios
支持使用CancelToken
來取消請求,這在某些情況下(例如用戶操作後中斷 API 請求)很有用。