java-layui下载单个或多个文件

首先设置使用的浏览器,允许同时下载多个文件,这个可以在下载的时候有的浏览器会弹出提示框是否允许下载多文件,有的不弹或者默认禁止的,需要手动设置,这个根据使用的浏览器,自行百度设置即可。代码未用到实际项目中,写的比较杂乱,测试可用后根据自己的需求进行改进和整理。

我想到三个方法:目前使用的是第一种

1:前端循环调用后台,每调用一次下载一个文件

2:将后台文件打包zip成一个文件,然后下载这个zip

3:百度搜了一下有些人写的可以直接下载多文件,不用循环,我尝试了几个都不好使,如大家有好的方法欢迎留言互相学习

 页面按钮

<div class="layui-btn layui-btn-sm layui-btn-primary febs-button-blue-plain  table-action"
                                     id="downloadFileAll"  lay-event="downloadFileAll">
                                    <i class="layui-icon febs-edit-area febs-blue">&#xe82a;</i>全部下载
                                </div>

按钮事件

$('#downloadFileAll').on('click', function () {
            console.log("点击全部下载。。获取所有id。。再来个遮罩层")
            let checkStatus = table1.checkStatus('myDaibanDownloadTable');
            if (!checkStatus.data.length) {
                febs1.alert.warn('请勾选需要下载的文件');
            } else {
                let ids = [];
                layui.each(checkStatus.data, function (key, item) {
                    ids.push(item.id)
                });
                console.log("----"+ids)
                console.log("==="+ids.join(','))
                //此处不要用ajax,使用下面的方式传参
                for(var i=1;i<3;i++){
                    console.log("i=========="+i);
                    window.location.href="sjyProjecfiles/downFile?ids="+i;
                    sleep(2000);//此处为下载多个文件做个间隔
                }
            }
        });

后台接口

//下载六个文件
    @GetMapping("downFile")
    @ResponseBody
    public void sjyProjecfilesList(String ids,HttpServletResponse response) {
        //选择的课题json
        System.out.println("下载文件的人和文件"+ids);
        //根据ids查询文件名
        String parentpath="D:\\project-files\\20220811\\";
        String filename="附件4:中国移动吉林公司2022年家宽综合调度支撑平台扩容工程-comsic功能点拆分表.xlsx";
        System.out.println(parentpath+filename);
        if("1".equals(ids)){
            downFile(parentpath,filename,response);
        }else{
            downFile("D:\\project-files\\20220811\\","jin1.docx",response);
        }
    }

下载工具方法downFile

public void downFile(String parentpath,String filename, HttpServletResponse response) {
        File file = new File(parentpath + filename);
        response.setCharacterEncoding("utf-8");
        //response.setHeader("Content-type", "application/zip");
        String downloadFilename = new String(filename.getBytes(StandardCharsets.UTF_8), StandardCharsets.ISO_8859_1);
        response.setContentType("application/force-download");
        response.setHeader("Access-Control-Expose-Headers", "Content-Disposition");//设置允许跨域的key
        response.setHeader("Content-Disposition", "attachment;filename=" + downloadFilename);
        if (file.exists()) {
            System.out.println("文件存在");
            byte[] buffer = new byte[1024];
            try {
                FileInputStream fis = new FileInputStream(file);
                BufferedInputStream bis = new BufferedInputStream(fis);
                OutputStream os = response.getOutputStream();
                int i = bis.read(buffer);
                while (i != -1) {
                    os.write(buffer, 0, i);
                    i = bis.read(buffer);
                }
                //bis.close();
                //fis.close();
            } catch (Exception e) {
                e.printStackTrace();
            }

        }
    }

### Layui 图片上传 Java 后端实现 #### Spring MVC 配置 为了使 `MultipartFile` 不为空,在 `spring-servlet.xml` 者对应的 SpringMVC 配置文件中需配置一个多部分解析器 bean: ```xml <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="maxUploadSize" value="209715200"/> <property name="defaultEncoding" value="UTF-8"/> <property name="resolveLazily" value="true"/> </bean> ``` 此配置允许服务器接收大尺寸的文件并指定编码方式,防止乱码问题发生[^4]。 #### 控制层代码示例 创建一个控制器来处理来自前端的请求。假设路径映射为 `/uploadImage`: ```java import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.multipart.MultipartFile; @Controller public class ImageUploadController { @RequestMapping("/uploadImage") public @ResponseBody String handleFileUpload(@RequestParam("file") MultipartFile file) { if (!file.isEmpty()) { try { byte[] bytes = file.getBytes(); // 存储逻辑... return "success"; } catch (Exception e) { return "failure"; } } else { return "failure"; } } } ``` 这段代码展示了如何定义一个简单的 RESTful API 来接受单个文件上传,并返回成功与否的信息字符串[^3]。 #### 前端调用方法 在客户端可以利用 Layui 的 `upload.render()` 方法发起上传操作,具体参数可以根据实际需求调整: ```javascript layui.use('upload', function(){ var upload = layui.upload; // 执行实例 upload.render({ elem: '#test' // 绑定元素 ,url: '/uploadImage' // 接口地址 ,done: function(res){ console.log(res); // 输出结果 } }); }); ``` 上述 JavaScript 片段用于初始化上传组件并与后端服务对接,确保 URL 路径匹配后端设定的服务入口[^1]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值