需求
后端通过接口将excel文件通过blob类型数据进行返回,前端接收数据并将其转化为excel文件进行下载
实现
接口方法
responseType:值为blob,标记返回数据类型为blob
Content-Type:请求头设置,值为application/vnd.ms-excel,标记类型为excel文件
// request为项目内部封装
export const getDownLoadUrl = () => {return request({url: '/aiModel/superModel/superModelImportTemplate',method: 'get',responseType: 'blob',headers: {'Content-Type': 'application/vnd.ms-excel'}})
}
转化方法
创建blob类型对应的url对象挂载到链接上,并模拟点击链接方式进行excel文件下载
export function downloadBlob(blob, name) {const url = URL.createObjectURL(blob)const a = document.createElement('a')a.href = urla.download = namedocument.body.appendChild(a)a.click()document.body.removeChild(a)URL.revokeObjectURL(url) // 释放对象
}
调用逻辑
使用上述实现的两个方法,从接口获取blob后将其转化为excel文件下载
const download = async() => {const res = await getDownLoadUrl()downloadBlob(res, 'excel模板.xlsx')
}