记一次 接口返回文件流或json类型数据时,前端的兼容处理。 要求调用接口上传文件,成功时,返回值为json,提示json中的信息;失败时,返回值为流,下载的流文件。需要前端进行兼容判断。

大致思路:设置responseType: 'blob'作为返回值的解析方式,统一以blob的方式解析,然后通过FileReader.readAsText读取blob数据为string,根据string能否解析为json判断接口返回的数据类型。

axios({
	...	// 请求参数
   responseType: 'blob' // 设置responseType: 'blob'作为返回值的解析方式,统一以blob的方式解析
}).then(res => {
	// 通过FileReader读取blob数据为string
	const reader = new FileReader();
        reader.readAsText(error.data);
	reader.onload = event => {
		try {
			// 将读取的string转换为json
			// 若果能转换成功 => 接口返回的是json数据,提示报错信息
			const json = JSON.parse(event.target.result);
			if (json) {
				this.$message.error(json.msg)
		} catch (err) {
			// 不能被转换成json => 接口返回的是blob, 下载blob文件
                         const textValue = '剔除名单模板.xlsx';
                         downloadFileExport(res, textValue);
    autonomic
        一名前端菜鸟
        12.0k
      
粉丝