查了网友的的封装大部分是在uni.request外面套一层,
不是我想要的,这样封装太不灵活,成功和失败都在成功回调中,太乱了,
首选当然是用拦截器封装,但可查资料太少,我测试了好多天,完成了微信小程序和H5的封装,
APP还是没搞明白,一个原因也是我的工具不支持vue3的断点调试,不知道大家的工具行不行,
这边我把自己调好的成果和大家分享一下
uni.addInterceptor('request', {//请求拦截
invoke(args){
//这边可以添加 token 和 IP
//还可以根据IP和data判断是否重复请求,
//正常请求就添加请求列队
//拦截重复的请求可以返回false
return true
},
returnValue(args){//实现分流,只要200走 success 其它都走 fail
if(args){ //在invoke 中被拦截的请求,这边会是空指针,所以要判断
// #ifdef MP-WEIXIN
args.onHeadersReceived((res)=>{
if(res.statusCode==200){
//什么都不执行则回调 success
}else{
args.abort();//回调 fail
}
})
//#endif
// #ifdef H5
args._xhr.onreadystatechange = (res) =>{
if(args._xhr.readyState==4){
if(res.target.status==200){
args._xhr.onload();//成功回调 success
}else{
args._xhr.onerror(); //失败回调 fail
}
}
}
// #endif
}
},
success(res){
//这边是可以改造res值的,不要直接赋值,引用类型,你懂得
},
complete(res,obj) {
//请求结束,可以根据第二参数,移除请求列队,防止重复请求
}
});
好了,以上就是我的成果,希望对大家有帮助,现在还差APP端,实在是工具打不了断点,连返回的对象有哪些方法参数都看不了,又找不到这方面的资料,在线等呀,我的QQ:83606260,微信:15659558682 有懂的小伙伴告诉我 一下哈
1 个回复
蔡cai
可以console.log打印出来