我们不需要根据服务器返回的情况去随机设置responseType
一、我们要明白,我们在请求下载文件的api时候,可能给我们的返回值有两种情况:
- 直接给我们了我们想要的文件流
- 还有可能得到了JSON返回数据,让我们展现提示出信息或者被叫为错误信息
二、理解responseType
axios中这样描述的:responseType`表示服务器响应的数据类型,可以是 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream'
不过我经常用blob,其实用什么都无所谓,主要看在拿到返回值的时候如何处理。
三、处理返回值的不同情况
const API = axios.create({ baseURL: API_HOST }) API({ method: 'get', url: file.url, responseType: 'blob' }).then(response => { const type = response.type || null //relType你所下载的文件类型,这里是xlsx const relType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' if (type.includes(relType)) { /**做文件下载 */ return } if (type.includes('application/json')) { let reader = new FileReader() reader.onload = e => { if (e.target.readyState === 2) { let res = {} res = JSON.parse(e.target.result) console.info('back:: ', res) } } reader.readAsText(response) } })
根据response.type返回内容的MIME TYPE 来判断是要下载文件,还是要去做一些JSON数据提示什么的操作。如果是JSON类型那就把Blob通过readAsText转为JSON格式。这种方式通过测试IE10和IE10以上版本。
可以尝试在arrayBuffer的情况下使用arrayBuffer to Json来进行信息提示。