uni.addInterceptor 无法正确处理多个拦截器异步的链式调用

[fhaskla]

发行方式

小程序

具体平台

微信小程序

开发环境

Windows

项目创建方式

CLI命令行

依赖版本

{
"name": "hm-shopping",
"version": "0.1.0",
"private": true,
"dependencies": {
"@vant/weapp": "^1.11.7",
"vue": "^2.6.14",
"vuex": "^3.6.2"
},
"devDependencies": {
"@vue/cli-service": "^5.0.8",
"postcss-px-to-viewport": "^1.1.1"
}
}

问题描述

uni.addInterceptor('switchTab', {
invoke(options) {
return new Promise((resolve) => {
setTimeout(() => {
console.log('s1-invoke')
resolve(options)
}, 3000)
})
},
success(res) {
console.log('s1-success')
}
})
uni.addInterceptor('switchTab', {
invoke(options) {
return new Promise((resolve) => {
setTimeout(() => {
console.log('s2-invoke')
resolve(options)
}, 3000)
})
},
success(res) {
console.log('s2-success')
}
}
)
这段代码会在打印's1-invoke'后结束，后续的's2-invoke'，'s1-success'，'s2-success'都被阻断了，而且控制台不会有任意报错

重现步骤

使用拦截器拦截任意一个 api，并且添加多个异步拦截器就可以复现这个问题

期望行为

可以正确处理promise的链式调用，先打印's1-invoke'再打印's2-invoke'，'s1-success'，'s2-success'，当然我不知道uniapp是不是不支持我使用多个异步链式调用，但是我在源代码里其实是有看到类似的多个异步链式调用处理的

实际行为

No response

截图或录屏

我在b站发布了一个视频进行更详细的问题说明，以下是地址：【uniapp 的拦截器有 bug 的。。。】 https://www.bilibili.com/video/BV1oeGCzwE28/?share_source=copy_web&vd_source=9fcc32460033b08131c59254afaf7a1c

[fhaskla]

如果不使用异步，两个拦截器都使用同步，
uni.addInterceptor('switchTab', {
invoke(options) {
console.log('s1-invoke')
},
success(res) {
console.log('s1-success')
}
})
uni.addInterceptor('switchTab', {
invoke(options) {
console.log('s2-invoke')
},
success(res) {
console.log('s2-success')
}
}
)就类似这样，其实是可以正常打印's1-invoke'，'s2-invoke'，'s1-success'，'s2-success'的，我在想，同步的都可以链式调用，异步的不行是不是就算一个bug

[chouchouji]

具体原理要再研究下，不过你可以去掉return试下，看看这个输出是否符合你的预期

[fhaskla]

invoke没有return的话默认return undefined，触发的是同步拦截的逻辑，同步拦截的逻辑是如果返回的是false，那就拦截，如果返回的是除了false的其他任意值都不会进行拦截，这符合看到的效果，因为没有进行拦截，invoke1执行完，然后invoke2执行，然后success1执行，success2执行，最后两个异步进行打印，如果invoke去return的是一个promise，那触发的是异步拦截的逻辑，异步拦截的逻辑有bug，首先是不能多个promise链式调用，然后是当通过多个invoke返回多个promise的时候，第一个invoke执行完后续的所有invoke，success全都不执行，卡在第一个invoke了，只有在只是提供了1个异步invoke的情况下，可以正确执行，多个异步invoke就会出错

[fhaskla]

uni.addInterceptor('switchTab', {
invoke(options) {
return new Promise((resolve) => {
setTimeout(() => {
resolve(options)
}, 3000)
})
}
})这段代码就是一个异步拦截的逻辑，3秒后放行，而且这里resolve的必须是invoke的options，有一点不一样都会被拦截，我也不知道为什么，如果写了两个invoke钩子的话就异常了