【无标题】axios全请求

最新推荐文章于 2026-01-08 20:54:44 发布

原创最新推荐文章于 2026-01-08 20:54:44 发布 · 228 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #html

本文介绍Axios库的使用方法，包括GET、POST等HTTP请求的发送方式，并演示了如何处理多个请求并发的情况。

Axios全攻略

axios 简介
引入方式：
some栗子
- Get（delete类同）
- Post（put类同）

axios 简介

从浏览器中创建 XMLHttpRequest
从 node.js 发出 http 请求
支持 Promise API
拦截请求和响应
转换请求和响应数据
取消请求
自动转换JSON数据
客户端支持防止 CSRF/XSRF

引入方式：

npm i axios
pnpm i axios
或者使用cdn：
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

some栗子

Get（delete类同）

// 向具有指定ID的用户发出请求
axios.get('/user?ID=12345')
.then(function (response) {
  console.log(response);
})
.catch(function (error) {
  console.log(error);
});
// 也可以通过 params 对象传递参数
axios.get('/user', {
  params: {
    ID: 12345
  }
})
.then(function (response) {
  console.log(response);
})
.catch(function (error) {
  console.log(error);
});

Post（put类同）

axios.post('/user', {
  firstName: 'Fred',
  lastName: 'Flintstone'
})
.then(function (response) {
  console.log(response);
})
.catch(function (error) {
  console.log(error);
});

##多请求并发

function getUserAccount() {
return axios.get('/user/12345');
}
function getUserPermissions() {
return axios.get('/user/12345/permissions');
}
axios.all([getUserAccount(), getUserPermissions()])
.then(axios.spread(function (acct, perms) {
  //两个请求现已完成
}));
var url = ['/user/12345', '/user/12345/permissions', ].map(A => axios.get(A))
Promise.all(url).then((result) => {
//请求已经完成
})