axios拦截器

简介: axios拦截器

分请求拦截器、响应拦截器

1. 新建一个 utils 文件夹,新建一个 request.js

2. request.js 中写入以下模板

// 引入axios
import axios from 'axios';
import qs from 'qs';
// 创建axios实例
const instance = axios.create();
// 请求拦截器
instance.interceptors.request.use(function (config) {
// 在发送请求之前做些什么
return config;
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error);
});
// 添加响应拦截器
instance.interceptors.response.use(function (response) {
// 对响应数据做点什么
return response;
}, function (error) {
// 对响应错误做点什么
return Promise.reject(error);
});
// 导出实例
export default instance;



3. 在需要的页面引入使用

1. request({
2. url: '',
3. params: { id: 1 }
4. }).then(data => {
5. })
相关文章
|
6月前
|
JavaScript 前端开发
axios拦截器的使用?
axios拦截器的使用?
|
6天前
|
JavaScript
axios拦截器:每次请求自动带上 token
axios拦截器:每次请求自动带上 token
10 0
|
6天前
|
前端开发
axios拦截器的使用?
axios拦截器的使用?
10 0
|
6天前
|
前端开发 JavaScript 数据格式
vue3中axios添加请求和响应的拦截器
vue3中axios添加请求和响应的拦截器
15 1
|
6天前
|
JavaScript API
Vue中axios拦截器怎么使用
Vue中axios拦截器怎么使用
|
9月前
|
前端开发
前端学习笔记202307学习笔记第六十天-axios拦截器3
前端学习笔记202307学习笔记第六十天-axios拦截器3
33 0
|
9月前
|
前端开发
前端学习笔记202307学习笔记第六十天-axios拦截器2
前端学习笔记202307学习笔记第六十天-axios拦截器2
25 0
|
6天前
【Axios】配置默认值及拦截器代码逐行详解
【Axios】配置默认值及拦截器代码逐行详解
43 0
|
6天前
|
资源调度 JavaScript API
vue封装axios请求接口并添加前置拦截器和响应拦截器
vue封装axios请求接口并添加前置拦截器和响应拦截器
48 0