当前位置：首页 > news >正文

前端面试题（三）：axios有哪些常用的方法

news 2025/7/11 6:51:57

Axios 是一个基于 Promise 的 HTTP 客户端，用于浏览器和 Node.js 中发送 HTTP 请求。它提供了一些常用的方法来处理不同类型的请求。以下是 Axios 中常用的一些方法：

1. axios.get()

用于发送 GET 请求，从服务器获取数据。

axios.get('/api/data')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

2. axios.post()

用于发送 POST 请求，向服务器发送数据。

axios.post('/api/data', { name: 'John', age: 30 })
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

3. axios.put()

用于发送 PUT 请求，更新指定资源的完整数据。

axios.put('/api/data/1', { name: 'John', age: 31 })
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

4. axios.patch()

用于发送 PATCH 请求，部分更新指定资源的数据。

axios.patch('/api/data/1', { age: 32 })
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

5. axios.delete()

用于发送 DELETE 请求，删除指定资源。

axios.delete('/api/data/1')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

6. axios.all()

用于发送多个并发请求，返回一个 Promise，并且可以在所有请求都完成后执行回调。

axios.all([
  axios.get('/api/data1'),
  axios.get('/api/data2')
])
.then(axios.spread((response1, response2) => {
  console.log(response1.data, response2.data);
}))
.catch(error => {
  console.error(error);
});

7. axios.create()

用于创建一个自定义配置的 Axios 实例，可以复用配置并改变默认的设置（如 baseURL、headers、timeout 等）。

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

instance.get('/data')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

8. axios.interceptors

用于拦截请求或响应。你可以使用 request 和 response 拦截器来对请求和响应进行处理（例如，设置公共请求头、处理错误等）。

请求拦截器：

axios.interceptors.request.use(
  config => {
    // 在请求发送前做一些处理
    config.headers.Authorization = 'Bearer token';
    return config;
  },
  error => {
    return Promise.reject(error);
  }
);

响应拦截器：

axios.interceptors.response.use(
  response => {
    // 处理响应数据
    return response;
  },
  error => {
    // 错误处理
    return Promise.reject(error);
  }
);

9. axios.getUri()

用于获取请求的 URL，它不会发送请求，只是返回请求的 URL 字符串。

const url = axios.getUri({
  url: '/api/data',
  params: {
    id: 123
  }
});
console.log(url); // 输出拼接好的完整 URL

10. axios.request()

axios.request() 是一个通用的方法，所有 HTTP 请求方法（如 get、post、put、delete）都可以通过该方法来发送。你可以通过传入配置对象来执行请求。

axios.request({
  url: '/api/data',
  method: 'get',
  params: {
    id: 123
  }
})
.then(response => {
  console.log(response.data);
})
.catch(error => {
  console.error(error);
});

总结：

axios.get(), axios.post(), axios.put(), axios.patch(), axios.delete() 是常用的 HTTP 方法，用于不同的请求类型。
axios.all() 用于处理多个并发请求。
axios.create() 用于创建自定义配置的实例。
axios.request() 是一个通用方法，可以处理所有类型的请求。
axios.interceptors 用于处理请求和响应的拦截器。

这些方法和功能提供了很大的灵活性，可以帮助你在处理 API 请求时更好地管理和优化请求。

查看全文

http://www.dtcms.com/a/108652.html