js下载二进制流到本地

前端挖掘机

已于 2022-11-30 09:16:18 修改

阅读量1.6k

点赞数 2

CC 4.0 BY-SA版权

文章标签： javascript

于 2022-05-24 09:57:59 首次发布

本文链接：https://blog.csdn.net/bzf0482/article/details/124941235

该博客详细介绍了如何使用JavaScript动态创建a标签来实现二进制文件的下载，包括处理文件流、设置响应类型为arraybuffer以及清理资源的完整过程。示例代码展示了在不同浏览器的兼容性处理，并给出了axios库请求文件流时的配置示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

下载二进制使用a标签就可以做到，所以可以动态创建标签，下载完成后删除a标签

function downLoad(buffer, name, type){
	if(!buffer || !type) return 
   	const blob = new Blob([buffer], {
        type: "application/arraybuffer",
    });
    // 兼容不同浏览器的URL对象
    const url = window.URL || window.webkitURL || window.moxURL;
    // 创建下载链接
    const downloadHref = url.createObjectURL(blob);
    // 创建a标签并为其添加属性
    const link = document.createElement("a");
    link.href = downloadHref;
    link.download = `${name || '导出文件'}.${type}`;
    // 触发点击事件执行下载
    document.body.appendChild(link);
    downloadLink.click();
    // 下载完成就删掉a标签
    document.body.removeChild(link); 
    //释放blob对象
    url.revokeObjectURL(downloadHref);
}

以上完整代码开箱即用

请求文件流的时候也要设置返回参数格式，不然会乱码，以axios为例

axios.post("xxxxx", params, {
    responseType: "arraybuffer",
 });