Koa2 中使用 axios 发送 http 请求

在前端开发中，发送 HTTP 请求是非常常见的操作。而在 Koa2 中，我们可以使用 axios 库来发送 HTTP 请求。axios 是一个基于 Promise 的 HTTP 客户端，可以在浏览器和 Node.js 中使用。它具有许多强大的功能，例如拦截请求和响应、转换请求和响应数据、取消请求等。

安装 axios

首先，我们需要安装 axios。可以使用 npm 或 yarn 进行安装：

npm install axios

或者

yarn add axios

发送 GET 请求

使用 axios 发送 GET 请求非常简单。我们只需要调用 axios.get() 方法并传入请求 URL 就可以了。例如：

const axios = require('axios');

axios.get('https://api.github.com/users/octocat')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.log(error);
  });

在这个例子中，我们向 GitHub API 发送了一个 GET 请求，获取了 octocat 用户的信息。当请求成功时，我们打印了响应数据；当请求失败时，我们打印了错误信息。

发送 POST 请求

使用 axios 发送 POST 请求也很简单。我们只需要调用 axios.post() 方法并传入请求 URL 和请求数据就可以了。例如：

const axios = require('axios');

axios.post('https://jsonplaceholder.typicode.com/posts', {
    title: 'foo',
    body: 'bar',
    userId: 1
  })
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.log(error);
  });

在这个例子中，我们向 JSONPlaceholder API 发送了一个 POST 请求，创建了一篇新的文章。请求数据包括文章的标题、内容和作者 ID。当请求成功时，我们打印了响应数据；当请求失败时，我们打印了错误信息。

发送并发请求

使用 axios 发送并发请求也很方便。我们只需要调用 axios.all() 方法并传入多个 axios 实例就可以了。例如：

const axios = require('axios');

axios.all([
    axios.get('https://api.github.com/users/octocat'),
    axios.get('https://api.github.com/users/mojombo')
  ])
  .then(response => {
    console.log(response[0].data);
    console.log(response[1].data);
  })
  .catch(error => {
    console.log(error);
  });

在这个例子中，我们向 GitHub API 发送了两个 GET 请求，获取了 octocat 和 mojombo 用户的信息。当两个请求都成功时，我们打印了响应数据；当任何一个请求失败时，我们打印了错误信息。

拦截请求和响应

使用 axios 可以拦截请求和响应，进行一些特殊处理。例如，我们可以在请求头中添加一些特殊信息，或者在响应数据中进行一些特殊处理。

const axios = require('axios');

axios.interceptors.request.use(config => {
  config.headers.Authorization = 'Bearer ' + localStorage.getItem('token');
  return config;
});

axios.interceptors.response.use(response => {
  response.data = response.data.results;
  return response;
});

axios.get('https://api.github.com/users/octocat')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.log(error);
  });

在这个例子中，我们使用 axios 的拦截器，在请求头中添加了一个 Authorization 字段，并在响应数据中将结果数组赋值给了 data 属性。

总结

在 Koa2 中使用 axios 发送 HTTP 请求非常简单。我们可以使用 axios.get()、axios.post() 和 axios.all() 方法来发送不同类型的请求，而且可以使用拦截器对请求和响应进行特殊处理。axios 还有许多其他强大的功能，例如取消请求、转换请求和响应数据等，可以根据需要进行使用。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/658e8e6deb4cecbf2d46f3e0