记录一个在开发过程中遇到过的问题：Blob 类型转成JSON

问题描述：

需要实现点击导出WORD文件功能, 有两种情况

1. 如果符合导出条件， 后端直接返回数据流，如下图所示的一堆看不懂的东西：

2. 不满足导出条件， 则后端返回JSON， 并附上失败原因， 前端需要将失败原因展示出来

eg:

{
    "resultCode":-1,
    "resultInfo”:”我是失败原因”,
    "data":null
}

开发过程：

一开始就只考虑返回成功的情况， 也就是我们会将返回的数据转成blob格式

不过这会就会有一个明显的错误， 就是当返回失败的时候， 还是导出了，但是导出的是一个不正确的.JSON文件

解决方法：

主要是用到 FileReader

// 导出方法

export function exportSettleProve(params, errCallback, successCallback) {
    return dispatch => {
        return post(‘请求URL地址’, JSON.stringify(params))
           .then(res => res.blob())
           .then(res => {
               let reader = new FileReader();
	      	// 处理load事件。该事件在读取操作完成时触发
               reader.onload = e => {
		console.log(‘’拿到返回结果,,e.target.result);
		// 此处由于拿到的e.target.result都是string类型的,如果对返回的数据流使用JSON.parse会导致报错  
                   if(e.target.result.indexOf('resultCode') != -1) {
                       if(JSON.parse(e.target.result).resultCode == -1) {
                           errCallback(JSON.parse(e.target.result).resultInfo);
                       }
                   }else {
                        successCallback(res);
                   }
               };
		// 开始读取指定的Blob中的内容。一旦完成，result属性中将包含一个字符串以表示所读取的文件内容。
               reader.readAsText(res);
           })
    }
}