前端请求封装之请求串行和并行

[qingshui33]

突然遇到了个问题，怎么保证前端接口的请求顺序呢，之前好像没怎么关注过这个事情

要实现的功能：在封装请求类库的时候，可以手动指定某些接口是串行的，如果没有指定，就默认的就行了

一个项目中，如果某些特殊的接口需要串行，就是有的接口会依赖其他接口的返回值，比如获取 token 接口和其他接口请求的时候需要添加 token 信息

正常来说，如果遇到上面这种请求，那直接在获取 token 的接口的回调中调用对应的接口就可以了，但是，如果这些接口不是在同一个页面呢

上面这种情况就困住我了，目前想不到什么方法能实现这种情况的封装，求各位大哥指点下

[nitmali]

rxjs 可能可以解决你的需求。

[paic]

promise 封装接口，然后 async await 。试着做一套登录校验逻辑，结合路由跳转更有意思。你就掌握了。

[qingshui33]

@nitmali 好的，感谢感谢，我去看看啊

[qingshui33]

@paic 登录的那个我只是举了个例子，我更希望的是有个参数可以来控制是否是串行 😂

[Pastsong]

await fetch('a')
await fetch('b')
await fetch('c')

和

await Promise.all([fetch('a'), fetch('b'), fetch('c')])

的区别呗

[paic]

@nitmali 学到了

[lisxour]

@qingshui33 #4 你可以用别的库或者自己封装来完成你想要的，Promise/A+并没有你想象中的一个参数控制串行并行。

[cxe2v]

写一个任务队列函数，把请求丢给任务队列来执行就是串行了

[LOG1SK]

写个任务调度器就好了

[qingshui33]

@Pastsong
@lisxour
@cxe2v
@LOG1SK 好的，感谢大哥们的指点，我研究研究哈

[liuhuihao]

Promise.all 就是并行的 await 就是串行的。
至于你说的 token 的例子，vue 里来的话，获取 token 的接口会放到 router 的导航守卫 beforeEach 中，确保进入任何一个页面的时候都先获取 token 然后再跳转，进入页面后的接口自然就都带有 token 了。你说的 不同页面 中的 串行方法 也是借助 导航守卫在跳转页面前完成前置接口即可

[qingshui33]

@liuhuihao token 只是举了一个例子，不过你说的这个方法确实不错👍，感谢感谢

[zhx643]

alova.js

[ahaKai]

自己封装一个任务队列进行控制