使用htool工具导出和导入Excel表

htool官网
代码中用到的hool包里面的excel工具ExcelUtil

1. 引入依赖

    <!-- Java的工具类 --><dependency><groupId>cn.hutool</groupId><artifactId>hutool-all</artifactId><version>5.8.25</version></dependency><!-- 操作office文件 --><dependency><groupId>org.apache.poi</groupId><artifactId>poi-ooxml</artifactId><version>5.4.0</version></dependency></dependencies>

2. 导出excel

// adminList就是从数据库查询到的数据
private void writeExcel(HttpServletResponse response,List<Admin> adminList) throws Exception {// 1. 构建writer对象ExcelWriter writer = ExcelUtil.getWriter(true);	// 参数true，是否为xlsx格式// 2. 设置表头,第一个参数是实体类的属性名，第二个参数是excel文件中要呈现的列名writer.addHeaderAlias("username", "用户名");writer.addHeaderAlias("name", "姓名");writer.addHeaderAlias("phone", "手机号");writer.addHeaderAlias("email", "邮箱");// 在写excel文件时只写上面设置了别名的属性，如果不设置就算设置了别名也会把数据库查询到的所有信息都写入excel文件writer.setOnlyAlias(true);// 3. 写标题，合并0-3合计4个单元格，标题内容，这个不是必须的writer.merge(3, "用户信息表"); // 写excel是按顺序写入的，先写标题// 4. 将数据库的文件写入，第二个参数：是否强制写标题writer.write(adminList, true);// 5. 固定写法，设置响应类型和响应头response.setContentType("application/vnd.ms-excel;charset=utf-8");String fileName = URLEncoder.encode("管理员信息", StandardCharsets.UTF_8);  // 对“管理员信息”汉字进行编码response.setHeader("Content-Disposition","attachment;filename=" + fileName + ".xlsx");// 6. 写出到流并关闭ServletOutputStream out = response.getOutputStream();writer.flush(out, true);writer.close();// 关闭writer，释放内存IoUtil.close(out);//此处记得关闭输出Servlet流}

• 调用writeExcel的接口

// 导出选择id的数据，参数ids是要导出数据id的数组@GetMapping("/exportExcel")public void exportExcel(Integer[] ids, HttpServletResponse response) throws Exception {List<Admin>  allData = adminService.selectByIds(ids);try{writeExcel(response, allData);}catch (Exception e){throw new CustomException("导出失败");	// 自定义的异常处理}}

• 前端发送请求

window.open("http://localhost:8080/exportExcel/ids=1,2,3")

3. 导入Excel表

1. 使用element上传组件

• 注意name属性，这是传递给接口的名字，要与接口的参数名对应

      <el-upload:show-file-list="false"accept=".xls,.xlsx"name="a":on-success="handleImport"action="http://localhost:8080/admin/importExcel"style="display: inline-block;margin-left: 10px;position: relative;top:1px"><el-button type="info">批量导入</el-button></el-upload>

2. 接口代码

  @PostMapping("/importExcel")public Result<String> importExcel(MultipartFile a) throws Exception {	// 注意参数a要与前端<el-upload>组件的nama属性对应//  1. 拿到输入流 构建 readerInputStream inputStream = a.getInputStream();ExcelReader reader = ExcelUtil.getReader(inputStream);//  2. 通过Reader 读取 excel 里面的数据，第一个参数是Excel表中的标题行，第二个参数是实体类中对应的属性reader.addHeaderAlias("用户名", "username");reader.addHeaderAlias("姓名", "name");reader.addHeaderAlias("手机号", "phone");reader.addHeaderAlias("邮箱", "email");//    读取全部数据，默认第一行为标题行，从第二行开始读取数据
//    List<Admin> list = reader.readAll(Admin.class);// 我的excel设置了大标题的表头，第一个参数指定标题行的位置是1，第二个参数是数据开始行位置，第三个参数是实体类List<Admin> list = reader.read(1,2,Admin.class);// 3. 将数据写到数据库Integer i = adminService.addAdminBatch(list);return Result.ok("共导入了"+i+"条信息");}

3. 返回数据

// 批量导入按钮点击事件
const handleImport = (response) => {if (response.code === "1") {load()	// 重新加载页面的列表数据ElMessage.success(`导入成功,${response.data}`)} else {ElMessage.error(response.msg)}
}

4. 使用axios发送请求导出文件

• 使用认证后，前端发送window.open请求不方便携带token
• 后端发送文件的代码没有改变

1. 使用axios请求代替windows.open()

    request.get('/admin/exportExcel', {params: {ids: ids.join(',')},// Axios 会将服务器返回的响应数据封装成一个 Blob 对象responseType: 'blob',	})

2. 在拦截器中获取文件

// 响应拦截器
service.interceptors.response.use(response => {if (response.config.responseType === "blob") {// 从响应头中获取 Content-Dispositionconst contentDisposition = response.headers["content-disposition"];let extractedFileName = '';if (contentDisposition) {// 使用正则表达式匹配文件名const matches = contentDisposition.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/);if (matches != null && matches[1]) {// 去除引号，decodeURIComponent：对文件名编码处理extractedFileName = decodeURIComponent(matches[1].replace(/['"]/g, ''));}// 如果没有从响应头中获取到文件名，则使用传入的 fileName 或默认值extractedFileName = extractedFileName || "下载文件";const blob = new Blob([response.data]);const a = document.createElement("a");const url = window.URL.createObjectURL(blob);a.href = url;a.download = extractedFileName;a.click();window.URL.revokeObjectURL(url);ElMessage.success('文件下载成功');return Promise.resolve();}......
}

3. 对跨域请求过滤器配置

• 原因：在跨域请求中，浏览器默认只允许访问部分简单响应头，如 Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma，若要访问其他自定义响应头，需要在后端明确设置 ExposedHeaders。

	@Configurationpublic class CorsConfig {	     // 配置跨域请求过滤器@Beanpublic CorsFilter corsFilter() {CorsConfiguration config = new CorsConfiguration();config.addAllowedOrigin("*");config.addAllowedHeader("*");config.addAllowedMethod("*");// 暴露 Content-Disposition 响应头，允许前端访问config.addExposedHeader("Content-Disposition");UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();source.registerCorsConfiguration("/**", config);return new CorsFilter(source);}}