excel导出 下载弹框

文件下载,excel导出

实际开发中的文件下载和excel导出

在实际的开发过程中,我们经常会遇到这种需求,导出文件或者下载文件的时候,弹出保存弹框然后指定文件名或者路径然后再点保存的这种, 一般网上看到的excel文件到处,基本上看到的都是指定下载路径的,这里我针对弹框这种方式做一个说明

前端代码

exportExcel(){
    //获取弹框,并且弹出保存框
    let iframe = document.getElementById('downloadIframe');
    if (!iframe) {
      iframe = document.createElement('iframe');
      iframe.id = 'downloadIframe';
      iframe.style.display = 'none';
      document.body.appendChild(iframe);
    }
    //拼接路径,并调用相关下载的接口,返回的数据类型是bytes[]数组
    iframe.src = "http://localhost:8001/cft/user/uploadExcel"
}

后端代码

    @GetMapping("/uploadExcel")
    public ResponseEntity<byte []> testExportTest() throws IOException {

        String  [] excelheader  = {"项目","电话","联系人","金额","负责人","周期"};

        //创建文档对象
        HSSFWorkbook wb = new HSSFWorkbook();
        // 建立新的sheet对象（excel的表单）
        HSSFSheet sheet = wb.createSheet("项目信息统计");
        HSSFRow rowHead = sheet.createRow(0);

        // 创建第一行
        for (int i = 0; i < excelheader.length; i++) {
            rowHead.createCell(i).setCellValue(excelheader[i]);
        }
        HSSFRow row = sheet.createRow(1);
        row.createCell(0).setCellValue("社工协议");
        row.createCell(1).setCellValue("15071384121");
        row.createCell(2).setCellValue("王凯");
        row.createCell(3).setCellValue("500");
        row.createCell(4).setCellValue("周三");
        row.createCell(5).setCellValue("150");

        ByteArrayOutputStream os = new ByteArrayOutputStream();
        wb.write(os);
        os.flush();

        String fileName ="项目信息导出.xls";
        fileName = new String(fileName.getBytes("utf-8"),"ISO_8859_1");

        HttpHeaders httpHeaders = new HttpHeaders();
        httpHeaders.setContentType(MediaType.APPLICATION_OCTET_STREAM);
        httpHeaders.setContentDispositionFormData("attachment", fileName);

        //这里需要注意的事返回的数据类型是指定的
        return new  ResponseEntity<byte[]>(os.toByteArray(),httpHeaders,HttpStatus.OK);
    }

类似的,对于图片文件或者文本文件,因为浏览器默认都是直接打开的,我们需要将文件进行字节话,然后按照指定的类型返回,亦可以对文件进行下载功能

文章永久链接：https://tech.souyunku.com/40822