如何将后台返回的二进制数据流转换为想要的word,doc,或者xsls文件

3,107 阅读2分钟

在项目的应用过程中,需要将后台返回的二进制文件转换成我们想要的文件,在这里我们就要用到一个叫Blob的东西;

Blob:他是js的操作对象类,html5的文件操作对象,blob是用来存储二进制数据,Blob本身的对象还有两个属性,一个是type,一个是size; Blob还有一个叫slice()的属性,他是用来截取,不过他截取的是二进制数据,一般在大文件上传时,由于数据上传的大小受到限制,所以我们需要利用slice属性去切割数据 好了,进入正题,前面是一个对Blob的简单介绍,接下来,小姐姐带你们进入如何使用他:

正式用法介绍: 1.首先我们需要创建一个blob对象,我们通过Blob()构造函数来创建blob对象,如下: var blob=new Blob( ["数据"] , { type:'text/plain' } ) //创建Blob对象

他的构造函数含有两个参数: 第一个参数是一个数据数列,他可以是任何格式的数据,第二个是type,他是一个MIME的嗅探类型,

2.如果我们我们需要下载文件,则需要用到a标签的download属性;

代码如上; 这里的fileName定义为你想要导出的文件名以及格式 let fileName = 测试.xlsx, let fileName = 测试.do'c

如果到这里你发现下载后文件打不开,一定千万不要打我,这里我们在请求api的时候,一定要设置response的类型为blob responseType: 'blob'; 代码如下:

export function apitest(id,params){
 return request({
   url: `url`,
   method: 'get',
   params,
   responseType: 'blob'
 })
}

-----------------------------------我是华丽丽的分割线--------------------------------------------------------------- 由于后续项目需要兼容火狐浏览器,所以我们需要在代码中加入兼容火狐浏览器

link.download = fileName
document.body.appendChild(link)

加入以上的代码就可以兼容火狐浏览器