在项目的应用过程当中,须要将后台返回的二进制文件转换成咱们想要的文件,在这里咱们就要用到一个叫Blob的东西;html
Blob:他是js的操做对象类,html5的文件操做对象,blob是用来存储二进制数据,Blob自己的对象还有两个属性,一个是type,一个是size; Blob还有一个叫slice()的属性,他是用来截取,不过他截取的是二进制数据,通常在大文件上传时,因为数据上传的大小受到限制,因此咱们须要利用slice属性去切割数据 好了,进入正题,前面是一个对Blob的简单介绍,接下来,小姐姐带大家进入如何使用他:html5
正式用法介绍: 1.首先咱们须要建立一个blob对象,咱们经过Blob()构造函数来建立blob对象,以下: var blob=new Blob( ["数据"] , { type:'text/plain' } ) //建立Blob对象api
他的构造函数含有两个参数: 第一个参数是一个数据数列,他能够是任何格式的数据,第二个是type,他是一个MIME的嗅探类型,浏览器
2.若是咱们咱们须要下载文件,则须要用到a标签的download属性;bash
测试.xlsx
, let fileName =
测试.do'c
若是到这里你发现下载后文件打不开,必定千万不要打我,这里咱们在请求api的时候,必定要设置response的类型为blob responseType: 'blob'; 代码以下:app
export function apitest(id,params){
return request({
url: `url`,
method: 'get',
params,
responseType: 'blob'
})
}
复制代码
-----------------------------------我是华丽丽的分割线--------------------------------------------------------------- 因为后续项目须要兼容火狐浏览器,因此咱们须要在代码中加入兼容火狐浏览器函数
link.download = fileName
document.body.appendChild(link)
复制代码
加入以上的代码就能够兼容火狐浏览器测试