axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征: - 从浏览器中创建 XMLHttpRequest - 从 node.js 发出 http 请求 - 支持 Promise API - 拦截请求和响应 - 转换请求和响应数据 - 取消请求 - 自动转换JSON数据 - 客户端支持防止 CSRF/XSRF
在vue项目中引入axios步骤如下:
1.本地安装axios依赖
npm install axios -S
//或者
yarn add axios -S
2.封装axios 在util目录下,新建request.js
import axios from 'axios' //引入 axios
// 创建 axios 实例
const request = axios.create({
baseURL: 'http://localhost:8088/springbootdemo', //后端接口地址
timeout: 60000, // 请求超时时间
})
export default request
3.在视图组件中使用axios调用后端接口
<script>
import request from "@/util/request";
...
export default {
name: "MyLogin",
methods:{
doLogin(){
//测试调用后台服务器接口,完成地址就是:http://localhost:8088/springbootdemo/users/auth
request.get('/users/auth',{
params:{
username:'admin',
password:'123456'
}
}).then(resp=>{
console.log(resp);
}).catch(err=>{
console.log(err);
})
}
}
}
</script>