axios 设置单个请求超时时间，以及整体设置超时时间

最新推荐文章于 2025-09-24 11:41:55 发布

原创

最新推荐文章于 2025-09-24 11:41:55 发布 · 1.1w 阅读

7 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端 #ajax

本文详细介绍了如何在axios中设置全局和单个请求的超时时间，包括在`axios.create`中配置基础超时时间和在单个请求配置中指定超时时间的方法。此外，还列举了axios请求配置的多种选项，如URL、数据处理、请求头、响应类型等，帮助开发者更好地理解和使用axios进行API交互。

在编写 axios 请求脚手架，我们不免得要整体设置下超时时间，整体使用axios.create 设置timeout即可

const instance = axios.create({
   
   
  baseURL: 'https://some-domain.com/api/',
  timeout: 1000,
  headers: {
   
   'X-Custom-Header': 'foobar'}
});

如果我们设置单个超时请求的话，参照axios官网的请求配置

{
   
   
   // `url` 是用于请求的服务器 URL
  url: '/user',

  // `method` 是创建请求时使用的方法
  method: 'get', // default

  // `baseURL` 将自动加在 `url` 前面，除非 `url` 是一个绝对 URL。
  // 它可以通过设置一个 `baseURL` 便于为 axios 实例的方法传递相对 URL
  baseURL: 'https://some-domain.com/api/',

  // `transformRequest` 允许在向服务器发送前，修改请求数据
  // 只能用在 'PUT', 'POST' 和 'PATCH' 这几个请求方法
  // 后面数组中的函数必须返回一个字符串，或 ArrayBuffer，或 Stream
  transformRequest: [function (data, headers) {
   
   
    // 对 data 进行任意转换处理
    return data;
  }],

  // `transformResponse` 在传递给 then/catch 前，允许修改响应数据
  transformResponse</