Chrome接口请求一直是pending状态,但接口实际上是正常的
1.现象
个别机器突然出现Chrome访问我司产品异常,本该通过接口获取的数据没有呈现,之前都是好好的,而且其他机器同样用同版本Chrome访问正常。
出现问题的机器重装Chrome问题依然存在,直到重装了操作系统才恢复正常。
2.分析
打开Chrome开发者工具发现,部分接口请求一直处于pending状态,进一步分析发现处于pending状态的请求是fetch和vue-resource发出的,jquery的ajax请求却是正常的。(不要问我为什么一个系统中存在这么多种请求方式-_-)
3.探索
首先,尝试用最新的版本替换。
幸运的是,vue-resource用当前最新版本(v1.3.1)替换后就正常了。
至于fetch,因为考虑兼容低版本的Chrome,没有用Chrome自带的fetch,而是用了fetch polyfill(https://github.com/github/fetch),更新了当前最新版本(2.0.3)后问题依然存在。
于是乎我就开始看fetch polyfill的源码了。
if ('responseType' in xhr && support.blob) { xhr.responseType = 'blob' }
虽然看不出为什么会导致个别机器Chrome有问题,但是因为我们的接口只返回文本数据,我就把responseType改成text,问题解决了!
if ('responseType' in xhr) { xhr.responseType = 'text' }