axios更适配复杂场景:默认抛出非2xx错误、自动序列化JSON、支持上传进度、拦截器和请求取消;fetch需手动处理cookie、状态码、序列化等,默认行为过于底层。

fetch 和 axios 都能发 HTTP 请求,但默认行为差异很大
直接说结论:如果你只是想快速发个 GET 请求,fetch 足够;但只要涉及错误处理、请求取消、上传进度、自动序列化 JSON 或统一拦截逻辑,axios 省事得多。
fetch 默认不带 cookie,401/403 不算 reject
fetch 默认不会携带 Cookie,也不会把 4xx/5xx 状态码当错误抛出——它只在真正“网络失败”(如断网、DNS 失败)时才 reject。这意味着你得手动检查 response.ok,否则 401 登录过期会静默返回空数据。
- 要发带凭证的请求,必须显式传
{ credentials: 'include' } - 必须自己写
if (!res.ok) throw new Error(...)才能进catch -
axios默认不带 cookie,但设withCredentials: true后行为更可控;且默认对非 2xx 状态码 reject
fetch('/api/user', { credentials: 'include' })
.then(res => {
if (!res.ok) throw new Error(`HTTP ${res.status}`);
return res.json();
})
.catch(err => console.error('请求失败:', err));
axios 自带 JSON 序列化和 Content-Type 设置,fetch 要手动做
用 fetch 发 POST JSON,你得自己 JSON.stringify、手动设 Content-Type: application/json;而 axios 对 data: { a: 1 } 会自动处理这两步,还支持 transformRequest 拓展。
-
fetch的body只接受string、FormData、Blob等,不能直接传对象 -
axios的data字段接受任意类型,根据配置自动适配(比如传FormData就不设Content-Type) - 上传大文件时,
axios可监听onUploadProgress,fetch没原生支持
axios.post('/api/upload', formData, {
onUploadProgress: e => console.log(`${e.loaded}/${e.total}`)
});
取消请求和拦截器是 axios 的硬优势,fetch 需靠 AbortController + 自封装
fetch 支持 AbortController 取消,但只能取消单个请求;axios 提供 CancelToken(旧版)或 AbortController(v0.22+),更重要的是它的请求/响应拦截器能统一加 token、处理错误弹窗、记录日志等。
立即学习“Java免费学习笔记(深入)”;
- 重复请求取消(比如搜索输入频繁触发)需自己维护
AbortController实例并 abort 旧的 -
axios.interceptors.request.use可自动注入Authorizationheader - 拦截器里
return Promise.reject(...)可提前中断请求链,fetch没对应机制
真正用起来,多数项目最终都会封装一层 fetch 或直接切到 axios——因为默认行为太“裸”,补全后代码量并不比 axios 少。











