欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

前后端分离,Excel导出实现

程序员文章站 2022-03-01 19:49:27
...

         本篇博客主要记录一下,springBoot + vue前后端分离的项目,如何实现Excel导出功能,项目代码可以参考之前的一篇博文:springBoot+shiro+vue的学生管理系统(二、总体功能及登录功能)

 

1.添加POI依赖:

        <!-- excel导出需要的依赖POI-->
        <dependency>
            <groupId>org.apache.poi</groupId>
            <artifactId>poi</artifactId>
            <version>3.6</version>
            <exclusions>
                <exclusion>
                    <groupId>javax.servlet</groupId>
                    <artifactId>servlet-api</artifactId>
                </exclusion>
                <exclusion>
                    <groupId>log4j</groupId>
                    <artifactId>log4j</artifactId>
                </exclusion>
            </exclusions>
        </dependency>

这里同时排除了多余的依赖,因为项目中已经引入了,不然就是重复引入了。

 

2.Excel导出工具类:

package com.qxf.utils;

import org.apache.poi.hssf.usermodel.*;

/**
 * @Auther: qiuxinfa
 * @Date: 2020/4/23
 * @Description: com.qxf.utils
 */
public class ExcelUtil {
    /**
     * 导出Excel
     * @param sheetName sheet名称
     * @param title 标题
     * @param values 内容
     * @return
     */
    public static HSSFWorkbook getHSSFWorkbook(String sheetName, String []title, String [][]values){

        // 第一步,创建一个HSSFWorkbook,对应一个Excel文件
        HSSFWorkbook wb = new HSSFWorkbook();

        // 第二步,在workbook中添加一个sheet,对应Excel文件中的sheet
        HSSFSheet sheet = wb.createSheet(sheetName);

        // 第三步,在sheet中添加表头第0行,注意老版本poi对Excel的行数列数有限制
        HSSFRow row = sheet.createRow(0);

        // 第四步,创建单元格样式,并设置值表头 设置表头居中
        HSSFCellStyle style = wb.createCellStyle();
        style.setAlignment(HSSFCellStyle.ALIGN_CENTER); // 创建一个居中格式

        //声明单元格
        HSSFCell cell = null;

        //创建标题
        for(int i=0;i<title.length;i++){
            //创建一个单元格
            cell = row.createCell(i);
            //给单元格赋值
            cell.setCellValue(title[i]);
            //给单元格设置样式
            cell.setCellStyle(style);
        }

        //创建内容
        if (values != null && values[0].length > 0){
            for(int i=0;i<values.length;i++){
                //从第二行开始创建数据填充的行,下标为1
                row = sheet.createRow(i + 1);
                for(int j=0;j<values[i].length;j++){
                    //将内容按顺序赋给对应的列对象
                    row.createCell(j).setCellValue(values[i][j]);
                }
            }
        }
        return wb;
    }
}

 

3.接口有一个前缀/user,没有贴出来了:

    /**
     * 导出报表,这里get和post请求复用了该方法,仅仅是为了测试
     *
     * @return
     */
    @RequestMapping(value = "/export")
    @ResponseBody
    public void export(@RequestBody(required = false) User user,String username,HttpServletResponse response) throws Exception {
        if (user ==null && !StringUtils.isEmpty(username)){
            //GET 请求的参数
            user = new User();
            user.setUsername(username);
        }
        //获取数据
        List<User> list = userService.findAllUser(user);

        //excel标题
        String[] title = {"姓名", "邮箱", "创建时间", "最近登录时间","角色","是否可用"};

        //excel文件名
        String fileName = System.currentTimeMillis() + ".xls";

        //sheet名
        String sheetName = "用户信息";

        //没有数据就传入null吧,Excel工具类有对null判断
        String [][] content = null;

        if (list != null && list.size() > 0){
            content = new String[list.size()][title.length];
            SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd hh:mm:ss");
            for (int i = 0; i < list.size(); i++) {
                content[i] = new String[title.length];
                User obj = list.get(i);
                content[i][0] = obj.getUsername();
                content[i][1] = obj.getEmail();
                content[i][2] = obj.getCreateTime() == null ? "" : sdf.format(obj.getCreateTime());
                content[i][3] = obj.getLastLoginTime() == null ? "": sdf.format(obj.getLastLoginTime());
                content[i][4] = obj.getRoleName();
                content[i][5] = obj.getEnable()==1 ? "是" : "否";
            }
        }

        //创建HSSFWorkbook
        HSSFWorkbook wb = ExcelUtil.getHSSFWorkbook(sheetName, title, content);

        //响应到客户端
        try {
            fileName = new String(fileName.getBytes(), "UTF-8");
            response.setContentType("application/vnd.ms-excel;charset=utf-8");
            response.setHeader("Content-Disposition", "attachment; filename=" + fileName);
            OutputStream os = response.getOutputStream();
            wb.write(os);
            os.flush();
            os.close();
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

service层之类的代码就不贴了

 

4.前端代码:

两种导出方式:

<el-form-item>
	<el-button type="primary" plain @click="exportUser">blob导出</el-button>
</el-form-item>
<el-form-item>
	<el-button type="infor" round @click="exportUserByA">a标签导出</el-button>
</el-form-item>

具体的js方法:

			// 导出用户,通过blob
			exportUser () {
				axios({
					  method: 'post',
					  url: 'http://192.168.43.152:8089/user/export',
					  data: {
					   username: this.filters.keyword
					  },
					  responseType: 'blob'
				  }).then((res) => {
					  console.log(res)
					  const link = document.createElement('a')
					  let blob = new Blob([res.data],{type: 'application/vnd.ms-excel'});
					  link.style.display = 'none'
					  link.href = URL.createObjectURL(blob);
					  console.log("href:"+link.href)
					  let num = ''
					  for(let i=0;i < 10;i++){
					   num += Math.ceil(Math.random() * 10)
					  }
					  link.setAttribute('download', num + '.xls')
					  document.body.appendChild(link)
					  link.click()
					  document.body.removeChild(link)
				  }).catch(error => {
					  console.log(error)
				  })
				
			},			
			// 导出用户,通过a标签
			exportUserByA () {
				let username = this.filters.keyword
				const link = document.createElement('a')
				link.href = "http://192.168.43.152:8089/user/export?username="+username
				document.body.appendChild(link)
				link.click()
				document.body.removeChild(link)
				
			},				

 

其实用a标签简单很多

相关标签: springboot 导出