axios 封装网络请求
时间: 2023-09-12 22:03:21 浏览: 45
axios是一个基于Promise的HTTP客户端,可以用于浏览器和Node.js端。下面是一个简单的axios封装网络请求的示例:
```javascript
import axios from 'axios';
// 创建axios实例
const service = axios.create({
baseURL: process.env.VUE_APP_BASE_API, // 接口的基础路径
timeout: 5000 // 请求超时时间
});
// 请求拦截器
service.interceptors.request.use(
config => {
// 在发送请求之前可以做一些处理,比如添加token等
return config;
},
error => {
// 处理请求错误
console.log(error);
return Promise.reject(error);
}
);
// 响应拦截器
service.interceptors.response.use(
response => {
// 对响应数据做一些处理,比如判断接口是否成功等
return response.data;
},
error => {
// 处理响应错误
console.log(error);
return Promise.reject(error);
}
);
export default service;
```
上面的代码中,我们首先通过`import axios from 'axios'`引入了axios。然后创建了一个axios实例并进行了一些基本配置,比如设置接口的基础路径和请求超时时间。
接下来使用`service.interceptors.request.use`方法添加了一个请求拦截器,可以在发送请求之前对请求进行一些处理,比如添加token等。
然后使用`service.interceptors.response.use`方法添加了一个响应拦截器,可以对响应数据进行一些处理,比如判断接口是否成功。
最后通过`export default service`导出axios实例,方便在项目中使用。
在实际使用中,可以通过`import service from '封装的axios路径'`引入封装好的axios实例,然后使用`service.get`、`service.post`等方法发送网络请求。