axios.interceptors.request 支持config自定义参数的方法及注意事项
1.在请求头里自定义参数2.直接在config中自定义参数注意**因为axios对传入的参数做了过滤处理,我们需要在过滤白名单数组中增加我们需要的字段(axios/lib/core/mergeConfig.js中),否则config对象里找不到isgetArray,isUpdateUser...
·
1.在请求头里自定义参数
//----http.js里
service.interceptors.request.use(config => {
console.log('config',config)
// 查看发送请求的接口有没有设置isLoading
if(config.headers.isLoading !== false){
startLoading();//请求时的加载动画
}
return config
}, error => {
Message({
message: error,
type: 'error',
})
Promise.reject(error)
})
//----封装的api 中
export function getApi (params) {
return request({
url: '/user/getApi.do',
method: 'get',
params,
headers:{ isLoading:true}
})
}
2.直接在config中自定义参数
//---http.js里
service.interceptors.request.use(config => {
console.log('config',config)
if (config.isgetArray) {
//(数组序列化问题见 文章 --axios get传递数组 paramsSerializer序列化)
config.paramsSerializer = function (params) {
return qs.stringify(params, {arrayFormat: 'repeat'}) 形式: ids=1&ids=2&id=3
}
}
if (config.isUpdateUser) { //要使自定义的isUpdateUser有效则需要在axios依赖下的lib/core/mergeConfig中添加白名单 防止被过滤掉
if (sessionStorage.getItem('updateUserToken')) {
config.headers.common['Authorization'] = sessionStorage.getItem('updateUserToken')
}
}
return config
}, error => {
Message({
message: error,
type: 'error',
})
Promise.reject(error)
})```
//----封装的api 中
export function getApi (params) {
return request({
url: '/user/getApi.do',
method: 'put',
data: params,
isUpdateUser: true,
})
}
注意
**因为axios对传入的参数做了过滤处理,我们需要在过滤白名单数组中增加我们需要的字段(axios/lib/core/mergeConfig.js中),否则config对象里找不到isgetArray,isUpdateUser
更多推荐
已为社区贡献2条内容
所有评论(0)