Fetch vs Axios

1 min read

Axios 相比于原生 fetch 在客户端使用时有许多优势：

  1. 自动转换 JSON 数据 - Axios 会自动将响应数据转换为 JSON，而 fetch 需要手动调用 .json()

  2. 更好的错误处理 - Axios 会对 HTTP 错误状态码（如 404 或 500）自动抛出错误，而 fetch 即使服务器返回 404，promise 也不会被 reject

  3. 请求和响应拦截器 - Axios 提供拦截器功能，可以在请求发送前或响应接收后进行处理

  4. 取消请求功能 - Axios 支持取消进行中的请求，fetch 虽然可以用 AbortController 实现，但使用更复杂

  5. 自动处理超时 - Axios 可以直接设置请求超时，fetch 需要额外实现

  6. 浏览器兼容性 - Axios 能在较旧的浏览器上工作，而 fetch 可能需要额外的 polyfill

  7. 同时支持 Node.js - Axios 可以在浏览器和 Node.js 环境中使用同样的 API

  8. 更多请求配置选项 - Axios 提供更丰富的配置选项，比如设置请求头、基础 URL 等

  9. 内置 CSRF 保护 - Axios 可以自动从 cookie 中获取 XSRF token 并将其添加到请求头中

不过，fetch 相比 Axios 也有一些优势：原生支持（不需要额外安装库）、体积更小，以及成为 Web 标准的一部分。选择哪个工具通常取决于项目的具体需求。