引语
鉴于之前axios版本升级,去掉了baseUrl配置的问题,前端对于axios库的升级未做版本固定,导致项目启动报错;除了写成固定版本,还可以自己写一套请求响应机制。
方法一:Promise.race(timeout, request)
顾名思义,Promse.race就是赛跑的意思,意思就是说,Promise.race([p1, p2, p3])里面哪个结果获得的快,就返回那个结果,不管结果本身是成功状态还是失败状态。
流程图
具体代码如下:
1 | timeoutPromise(timeout) { |
1 | wrapperRequest(request) { |
1 | get(url, querystring = {}, options = {}) { |
方法二:clearTimeout()
流程图
具体代码如下:
1 | // Handle request timeout |
1 | return fetch(url, apiOptions).then(response => { |
总结
axios固然好用,但是我的宗旨是:自己动手,丰衣足食;自己写了网络请求响应模块,如果还需要其他功能,自己拓展,自己维护这个模块。
方法一是网上给出的解决方案,思路固然好,但是对于正常平添了一个请求(一定会执行timeout的逻辑),而且无法满足我后续监听网络是否断开的操作(这个模块已经实现),有兴趣的朋友可以给我发邮件,后续我会新增这个模块的博客。
方法二是借鉴axios的源码,对请求超时响应的处理