Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。
如果您想在浏览器中使用 Axios，首先需要安装它。您可以使用 npm（Node 包管理器）或 yarn 来安装 Axios。例如，在命令行中输入以下命令：
shell复制代码
npm install axios |
或
csharp复制代码
yarn add axios |
安装完成后，您可以在 JavaScript 文件中引入 Axios，并使用它来发送 HTTP 请求。例如：
javascript复制代码
import axios from 'axios'; | |
axios.get('/user?ID=12345') | |
.then(function (response) { | |
// handle success | |
console.log(response); | |
}) | |
.catch(function (error) { | |
// handle error | |
console.log(error); | |
}) | |
.finally(function () { | |
// always executed | |
}); |
如果您想在 node.js 中使用 Axios，首先需要安装它。在命令行中输入以下命令：
shell复制代码
npm install axios |
或
csharp复制代码
yarn add axios |
安装完成后，您可以在 JavaScript 文件中引入 Axios，并使用它来发送 HTTP 请求。例如：
javascript复制代码
const axios = require('axios'); | |
axios.get('/user?ID=12345') | |
.then(function (response) { | |
console.log(response); | |
}) | |
.catch(function (error) { | |
console.log(error); | |
}); |
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://cdn.bootcdn.net/ajax/libs/axios/1.5.0/axios.js"></script><script src="https://cdn.bootcdn.net/ajax/libs/qs/6.11.2/qs.js"></script>
</head>
<body><script>// axios({// url:"",// method:'',// // 基础路径// baseUrl:"",// //get delete head 一类请求携带参数// params:{// },// //post put patch 一类请求携带// data:{// },// //请求头// headers:{},// //请求超过几秒中断请求// timeout:2000// })// axios get 请求返回的是一个promise对象// let res = axios({// url:"http://hmajax.itheima.net/api/ambition"// }).then(res =>{// console.log(res);// }).catch(error=>{// console.dir(error)// })// console.log(res);// get带参数 不需要转换数据格式 axios会自动转换为json查询字符串// let res = axios({// url:'http://121.199.0.35:8888/index/article/pageQuery',// // get类请求携带参数选项 params只接受一个纯js对象 // params:{// page:1,// pageSize:10// }// })// console.log(res);// post请求 post 参数 json字符串或者表单格式数据// post发起请求默认数据格式为json格式 请求头Content-Type也会自动设置为application/json// let res = axios({// url:'http://121.199.0.35:8888/user/login',// method:'post',// data:{// username:'admin1',// password:123321// }// })// console.log(res);//post 发起表单格式的请求let res = axios({url:"http://121.199.0.35:8888/baseUser/saveOrUpdate",method:'post',data:Qs.stringify({username:'aaa',password:1111}),headers:{'Authorization':'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VySWQiOiJNalU9Iiwic3ViIjoiYWRtaW4xIiwiaXNzIjoiMDk4ZjZiY2Q0NjIxZDM3M2NhZGU0ZTgzMjYyN2I0ZjYiLCJpYXQiOjE3MDIyNjMyNTYsImF1ZCI6InJlc3RhcGl1c2VyIiwiZXhwIjoxNzAyNDM2MDU2LCJuYmYiOjE3MDIyNjMyNTZ9.JHmlslry8c_MfFCBH5Ld4PUxYU1-2nMWo2OhOXO3H3g'}})console.log(res);</script>
</body>
</html>axios快捷方法
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://cdn.bootcdn.net/ajax/libs/qs/6.11.2/qs.js"></script><script src="https://cdn.bootcdn.net/ajax/libs/axios/1.5.0/axios.js"></script>
</head>
<body><script>// axios({})==>axios.request({})// 快捷方法 get无参 axios.get(url,请求配置项) // axios.get('http://121.199.0.35:8888/index/carousel/findAll').then(res=>{// console.log(res.data,'获取响应');// });// get带参 // axios.get('http://121.199.0.35:8888/index/article/pageQuery',{// params:{// page:1,// pageSize:10// },// headers:{// },// timeout:2000// }).then(res=>{// console.log(res.data,'获取响应');// })// delete head options // axios.post(url,data,请求配置项) 发起post请求 数据格式会自动转为json格式// let data = {// username:"admin1",// password:123321// }// axios.post('http://121.199.0.35:8888/user/login',data,{// timeout:2000,// headers:{}// }).then(res=>{// console.log(res);// })let data = {username:'测试用户9999888',password:654789,};axios.post('http://121.199.0.35:8888/baseUser/saveOrUpdate',Qs.stringify(data),{headers:{'Authorization': "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VySWQiOiJNalU9Iiwic3ViIjoiYWRtaW4xIiwiaXNzIjoiMDk4ZjZiY2Q0NjIxZDM3M2NhZGU0ZTgzMjYyN2I0ZjYiLCJpYXQiOjE3MDIyNjMyNTYsImF1ZCI6InJlc3RhcGl1c2VyIiwiZXhwIjoxNzAyNDM2MDU2LCJuYmYiOjE3MDIyNjMyNTZ9.JHmlslry8c_MfFCBH5Ld4PUxYU1-2nMWo2OhOXO3H3g"}}).then(res=>{console.log(res.data,'获取响应');})</script>
</body>
</html>
