Axios 是一个非常方便的 JavaScript 库，可以在 Node.js 中执行 HTTP 请求。

介绍

Axios 是一个非常受欢迎的 JavaScript 库，可以用来执行 HTTP 请求，适用于浏览器和 Node.js 平台。

它支持所有现代浏览器，包括对 IE8 及更高版本的支持。

它基于 Promise，并且可以使用 async/await 代码非常容易地执行 XHR 请求。

与原生的 Fetch API 相比，使用 Axios 具有许多优势：

  • 支持旧版浏览器（Fetch 需要使用 polyfill）
  • 可以中断请求
  • 可以设置响应超时
  • 内置 CSRF 保护
  • 支持上传进度
  • 执行自动的 JSON 数据转换
  • 可用于 Node.js

安装

可以使用 npm 安装 Axios：

npm install axios

或者使用 yarn 安装：

yarn add axios

可以通过 unpkg.com 在页面中引入 Axios：

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

Axios API

可以使用 axios 对象发起 HTTP 请求：

我使用 foo 和 bar 作为 随机名称。你可以输入任何名称替换它们。

axios({
  url: 'https://dog.ceo/api/breeds/list/all',
  method: 'get',
  data: {
    foo: 'bar'
  }
});

但为了方便起见，你通常会使用以下方法：

  • axios.get()
  • axios.post()

（就像在 jQuery 中使用 $.get() 和 $.post() 而不是 $.ajax() 一样）

Axios 还提供了一些不太常用但仍然有用的 HTTP 动词方法：

  • axios.delete()
  • axios.put()
  • axios.patch()
  • axios.options()

以及一个获取请求的 HTTP 标头（丢弃 body）的方法：

  • axios.head()

GET 请求

一种方便的使用 Axios 的方式是使用现代（ES2017）的 async/await 语法。

以下是一个在 Node.js 中使用 axios.get() 查询 Dog API 获取狗品种列表的示例，并统计数量：

const axios = require('axios');

const getBreeds = async () => {
  try {
    return await axios.get('https://dog.ceo/api/breeds/list/all');
  } catch (error) {
    console.error(error);
  }
};

const countBreeds = async () => {
  const breeds = await getBreeds();

  if (breeds.data.message) {
    console.log(`Got ${Object.entries(breeds.data.message).length} breeds`);
  }
};

countBreeds();

如果你不想使用 async/await，你可以使用 Promise 语法：

const axios = require('axios');

const getBreeds = () => {
  try {
    return axios.get('https://dog.ceo/api/breeds/list/all');
  } catch (error) {
    console.error(error);
  }
};

const countBreeds = async () => {
  const breeds = getBreeds()
    .then((response) => {
      if (response.data.message) {
        console.log(
          `Got ${Object.entries(response.data.message).length} breeds`
        );
      }
    })
    .catch((error) => {
      console.log(error);
    });
};

countBreeds();

在 GET 请求中添加参数

GET 请求的响应可以在 URL 中包含参数，例如：https://site.com/?foo=bar。

通过 Axios，你可以使用该 URL 进行请求：

axios.get('https://site.com/?foo=bar');

或者你可以在选项中使用 params 属性：

axios.get('https://site.com/', {
  params: {
    foo: 'bar'
  }
});

POST 请求

执行 POST 请求与执行 GET 请求类似，只需要使用 axios.post 替代 axios.get：

axios.post('https://site.com/');

第二个参数是一个包含 POST 参数的对象：

axios.post('https://site.com/', {
  foo: 'bar'
});