Fetch	Axios
类型	浏览器原生 API	第三方库
底层	基于 Promise，原生实现	浏览器基于 XMLHttpRequestNode 端基于 http 模块
体积	0	约 15KB
安装	无需安装	npm i axios

二、主要差异速查

默认携带 cookie ✅ 同源默认带，跨域需 withCredentials: true 自动转换请求体 ✅ 自动序列化

特性	Fetch	Axios
HTTP 错误是否进 catch	❌ 不进。需手动判断 res.ok	✅ 自动 reject
自动 JSON 解析	❌ 需 res.json	✅ 自动解析 response.data
请求/响应拦截器	❌ 无	✅ 内置 配置项请求超时 手动实现 ✅ timeout 配置项 请求取消 AbortController AbortController / CancelToken 上传/下载进度 ⚠️ 仅支持下载；上传需自己实现 onUploadProgress / onDownloadProgress
CSRF/XSRF 防护

三、详细对比

. .错误处理

fetch .n throw new Error;return res.json;}) .catch)，// 只有网络断开、CORS 失败、请求被中止才会进 catch

Axios：HTTP 错误自动进 catch。

axios.get .n) .catch { // 服务器返回了非 2xx console.log;} else if { // 请求发出但无响应 } else { // 配置错误 } });

. 请求体与响应体

Fetch：手动序列化 + 手动解析。

fetch,}) .n) .n);

Axios：自动处理。

axios.post .n);怎么说呢，// Content-Type 自动设为 application/json，body 自动序列化。data 自动解析

.拦截器

Axios：内置请求/响应拦截器可统一加 token、统一处理错误。

// 请求拦截器：每次请求自动加 tokenaxios.interceptors.request.use};return config;})，// 响应拦截器：自动跳登录页axios.interceptors..response..use location href = '/login';return Promise reject;})，

Fetch：没有拦截器，要么自己封装一层。要么用 monkey-patch：

const originalFetch = window fetch;window fetch = async => { options headers = {...options headers,Authorization:Bearer ${getToken}`};const res = await originalFetch;if location href = '/login';return res，};

.超时控制

Fetch：原生不支持，需。

const controller = new AbortController;const timer = setTimeout => controller abort,);fetch .finally => clearTimeout);

Axios：一行配置。

axios get;

.请求取消

const ctrl = new AbortController;fetch，ctrl abort;怎么说呢，// 取消

Axios：新版本一样使用。

const ctrl = new AbortController;
axios get，ctrl abort;

.上传进度

Fetch：原生不支持。

axios post => { const percent Math round * );console log，}});

.并发请求

Fetch：用。

const = await Promise all.n)。fetch '/api posts').n),]);

Axios：一样支持，旧版本另有 /。

const = await Promise all。axios get '/api posts'],]);

.跨域与 Cookie

Fetch：默认不发送 Cookie。

fetch '/api data',{ credentials: 'include' });//跨域携带fetch '/api data',{ credentials: 'same origin' });//同源携带

Axios：默认同源带 Cookie，跨域需配置。

五、怎么选

场景推荐


简单脚本、小项目、DemoFetch 

中后台、公司项目Axios 
体积敏感Fetch + Simple封装 
|需要兼容 IE | Axios | |Node+服务端 | Axios，或 Node + 原生 fetch | |React Server Components / Next js | Fetch  |






六、一句话

---