easypoi + spring boot + vue 实现 导出并下载 excel

开发中,导出 excel 是经常会遇到的,如果你使用 spring 框架,那么 easypoi 再适合不过了,它是对 Apache POI 的封装,但是使用起来却非常简单,唯一的缺点是包有点大,二十M左右,可能 Apache POI 本身就比较大吧,具体不清楚。

spring boot 集成 easypoi

由于有 easypoi-spring-boot-starter 所以集成非常简单,在你的 pom 文件里新增:

<dependency>
    <groupId>cn.afterturn</groupId>
    <artifactId>easypoi-spring-boot-starter</artifactId>
    <version>4.1.3</version>
</dependency>

至于版本号,你可以在 https://mvnrepository.com/artifact/cn.afterturn/easypoi-spring-boot-starter 查看最新版本。

然后,我们新建一个类,比如 VisitRecordModel.java 大致代码如下:

@Data
public class VisitRecordModel {

    @Excel(name = "标识", orderNum = "1")
    private String visitedFlag;

    @Excel(name = "计划回访时间", orderNum = "2", width = 12.0, exportFormat = "yyyy-MM-dd")
    private Date visitPlanDate;

}

然后 新建一个 EasyPoiUtil 类,代码如下:

public class EasyPoiUtil {

    public static void exportExcel(String title, String sheetName, boolean isCreateHeader,
                                   Class<?> pojoClass, List<?> data,
                                   HttpServletResponse response, String fileName) throws ExcelExportException {

        ExportParams exportParams = new ExportParams(title, sheetName);
        exportParams.setCreateHeadRows(isCreateHeader);

        Workbook workbook = ExcelExportUtil.exportExcel(exportParams, pojoClass, data);
        if (workbook == null) throw new ExcelExportException();

        try {
            downloadExcel(response, fileName, workbook);
        } catch (ExcelExportException e) {
            throw new ExcelExportException();
        }
    }

    private static void downloadExcel(HttpServletResponse response, String fileName, Workbook workbook) throws ExcelExportException {
        fileName = fileName  + ".xls";
        try {
            String encodeFileName = URLEncoder.encode(fileName, "UTF-8");
            response.setCharacterEncoding("UTF-8");
            response.setHeader("content-Type", "application/vnd.ms-excel");
            response.setHeader("Content-Disposition", "attachment;filename=" + encodeFileName);
            workbook.write(response.getOutputStream());
        } catch (Exception e) {
            throw new ExcelExportException();
        }
    }
}

这里的 download 方法支持 下载 中文的文件名哦,前提是你用 get 请求来下载,即 controller 层用 get 请求即可。调用如下:

private void downloadVisitRecord(ArrayList<HashMap<String, Object>> result, HttpServletResponse response) {
    List<VisitRecordModel> list = new ArrayList<>();
    for (HashMap<String, Object> map : result) {
        list.add(VisitRecordModel.fromMap(map));
    }
    try {
        EasyPoiUtil.exportExcel("xxxx - 回访记录", "回访记录", true,
                VisitRecordModel.class, list,
                response, "回访记录_" + DateUtils.formatDate(new Date(), "yyyy-MM-dd_HH-mm-ss"));
    } catch (ExcelExportException e) {
        throw new ExcelExportException();
    }
}

这里,传入 model 的 class 类型 以及 一个 list 数组,这个数组包含若干个 model 即可。如果使用 post 请求,那么 vue 部分代码需要修改,请求结束后,将返回保存为 blob 然后下载,即请求结束后代码如下:

const link = document.createElement("a");
let blob = new Blob([res], {
    type: "application/vnd.ms-excel"
});
link.style.display = "none";
link.href = URL.createObjectURL(blob);
link.setAttribute("download", "统计.xls");
document.body.appendChild(link);
link.click();
document.body.removeChild(link);

请求部分的代码也需要修改,具体如下:

return request({
    method: "post",
    url: "/xxx/xxx/export",
    data: params,
    responseType: "blob",
    headers: {
        "Content-Type": "multipart/form-data"
    }
})

如果请求部分代码不这样写,下载下来的 excel 会乱码哦,主要是 responseType 和 headers 吧!

本博客若无特殊说明则由 full-stack-trip 原创发布
转载请点名出处:全栈之旅 > easypoi + spring boot + vue 实现 导出并下载 excel
本文地址:https://www.kpromise.top/easypoi-spring-boot-vue-export-and-download-excel/

发表评论

电子邮件地址不会被公开。 必填项已用*标注