vue 中多个并发请求当一个请求检测到需要登录时，取消其它请求并在登录完成后重新发起

Question

这个项目是在微信中基于微信的静默登录，也就是不需要多余用户登录填写，只需要跳转重新加载一遍页面就完成登录了，之前是用拦截器做的检测到未登录的代码就直接跳转实现自动登录再返回原来页面，但是同一个页面该发起的请求还是同时发起了。现在我想实现的是//同时发起5个请求axios1()//假如第一个请求拿到数据检测到未登录的话就取消掉后边的几个请求axios2()axios3()axios4()axios5()有什么比较好的思路或者实现方式么？

Answer 1

你可以等到一个请求完之后在决定是否要发起后续的请求

Answer 2

这样行吗？

axios1().then(res=>{

        if(!res.login){

        //go login

        }else{

        axios2()

        axios3()

        axios4()

        axios5()

        }

})

Answer 3

通过cancelToken可以取消get类型请求，但是其他类型的请求无法通过cancelToken取消

Answer 4

你可以使用axios.all(),虽然不会取消其他请求，但是只要有一个借口异常，所有接口就不会走正常的回调函数，这样也不会影响业务操作

Answer 5

首先包装一下每一个 promise ，即使失败也至为 resolve 状态，然后用 Promise.race 确保一个完成后记录下 index 或者 id，然后重新发这个 array 里面的其他请求。

request 的 abort 不知道兼容性如何，这种方法是所有请求都必须发完全，并且除了成功的那个其他都会发两遍。

Answer 6

你可以在axios请求的时候做拦截

Answer 7

首先，你要复写 axios 方法（不推荐）或者自己封装一个方面（推荐），然后：

1. 接到任何请求，都直接加入队列

2. 判断是否已登录，如是，则正常发送请求

3. 如果不是，则跳转到登录页登录

4. 登录完成后，检查队列，如果有请求，就发送

Answer 8

http是无状态请求，请求无法被取消。非要用异步实现的这个功能是不可能的，但是你可以取消回调函数的执行。