SpringBoot项目Excel下载功能

需求:实现下载模板功能,提供一个批量导入的模板供下载使用。
思路:

1.用户点击下载按钮,向controller发送请求

2.后端接受到请求,获取到Excel模板文件

3.将此文件返回给前端页面,供用户下载

重点难点:

获取到Excel文件,返回到浏览器端。浏览端获取到流以后怎么返回给用户下载。

解决思路:

Excel保存在项目目录下,用ClassPathResource加载Excel资源文件,在通过输入流读取,在返回给响应的输出流。

设置axios的responseType为blob

前端将接收的流转化为blob对象,在供用户下载。

遇到问题:

无法弹出下载框:ajax,axios 请求,返回来的是二进制流的形式,所以是无法直接出现下载框的。

解决办法:

1.直接 <a href=”> 请求 或者 表单请求。

2.转换成blog对象在下载

核心代码:

代码:

前端js请求:

downLoadTemplate(){
      downLoadExcelTemplate().then( res => {
        //自定义文件名
        let fileName="批量导入Excel模板.xlsx"
        //创建一个blob对象,将后端返回的内容存到blob对象里
        let blob = new Blob([res])
        //创建一个dom元素
        let downloadElement = document.createElement('a')
        //createObjectURL方法生成一个对应Blob对象的URL,用于下载
        let href = window.URL.createObjectURL(blob); 
        downloadElement.href = href;
        //下载后文件名 
        downloadElement.download = fileName; 
        document.body.appendChild(downloadElement);
        //执行点击下载
        downloadElement.click(); 
        //下载完成移除元素
        document.body.removeChild(downloadElement); 
        //释放blob对象
        window.URL.revokeObjectURL(href); 
      })
    }

后端:

@Override
    public void downLoadExcelTemplate(HttpServletRequest request,HttpServletResponse response) {
        String templatePath="template/ExcelTemplates.xlsx";
            try {
                ClassPathResource resource = new ClassPathResource(templatePath);
                //清空缓存
                response.reset();
                //返回的是二进制流数据
                response.setContentType("application/octet-stream;charset=utf-8");
                //输入流读取
                BufferedInputStream inputStream = new BufferedInputStream((resource.getInputStream()));
                //getOutputStream() 可以向浏览器输出响应数据
                ServletOutputStream out = response.getOutputStream();


                int b = 0;
                byte[] buffer = new byte[1024];
                while ((b = inputStream.read(buffer)) != -1) {
                    out.write(buffer, 0, b);
                }
                inputStream.close();
                if (out != null) {
                    out.flush();
                    out.close();
                }
            } catch (IOException e) {
                e.printStackTrace();
                throw new BadRequestException("Excel模板下载异常");
            }
    }

参考:

(13条消息) Vue axios 后端返回excel文件流该如何下载_滑过了流星的博客-CSDN博客

SpringBoot之下载excel模板 - osc_uwnmtz9n的个人空间 - OSCHINA - 中文开源技术交流社区

详解,从后端导出文件到前端(Blob)下载过程 - SegmentFault 思否

javascript - What is the difference between an ArrayBuffer and a Blob? - Stack Overflow

Servlet第三篇【request和response简介、response的常见应用】 - SegmentFault 思否

HTTP content-type | 菜鸟教程 (runoob.com)

本作品采用《CC 协议》,转载必须注明作者和本文链接
讨论数量: 0
(= ̄ω ̄=)··· 暂无内容!

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!