前端 下载后端返回的二进制excel数据

目录

需求描述:

解决方案:


需求描述:

后端返回excel的二进制数据,前端收到二进制数据后,让浏览器下载对应excel文件。

解决方案:

这里的res就是指二进制数据

javascript 复制代码
        const link: any = document.createElement('a');
        const blob: Blob = new Blob([res], {
          type: 'application/vnd.ms-excel',
        });
        link.style.display = 'none';
        link.href = URL.createObjectURL(blob);
        // download="filename" 属性规定被下载的超链接目标。filename规定作为文件名来使用的文本。
        const date: Date = new Date();
        link.download = `file-export-${date.getFullYear()}-${date.getMonth()}-${date.getDay()}.xlsx`; // 下载的文件名
        // link(a)是一个dom元素(一个标签),向body中插入了一个dom(a)元素。
        document.body.appendChild(link);
        // 创建一个a链接 使用a.click()模拟点击
        link.click();
        document.body.removeChild(link);

调用以上逻辑即可将二进制数据转为文件,在浏览器中下载。

相关推荐
用户059540174464 分钟前
asyncio 踩坑实录:这个问题坑了我3小时,差点让线上服务崩掉
前端·css
喂哟咦6 分钟前
关于用codex两周写了一个epub阅读器这件事
前端·javascript
CDwenhuohuo19 分钟前
前端文件预览
开发语言·前端·javascript
test_000126 分钟前
JavaScript展开运算符的三个妙用
前端
前端尤雨西30 分钟前
ElementPlus 源码之 packages 目录
前端·element
我要让全世界知道我很低调31 分钟前
扔掉你的 Playwright MCP,拥抱 Playwright CLI
前端
Daybreak34 分钟前
从 npm 到 pnpm:包管理器演进与 Monorepo 依赖冲突求生
前端
Restart-AHTCM35 分钟前
AI 时代的大前端崛起,TypeScript 重塑前端开发
前端·人工智能·typescript·ai编程·a
008爬虫实战录35 分钟前
【最新猿人学】 验证码 - 图文点选 文字验证码识别
前端·javascript
一叶飘零晋1 小时前
【(一)Electron 使用之如何用vite+vue3搭建初始框架】
前端·javascript·electron