Vue+SpringBoot:整合JasperReport作PDF报表,并解决中文不显示问题

文章目录

一、前言

以前,在流行jdk1.6的时候,作pdf报表,用的软件是iReport。

后来,主流jdk升级到1.8后,这个,软件就停止更新了。

现在使用的是JasperReport Studio

下载Jaspersoft Studio 6

链接:https://pan.baidu.com/s/1mgkRC5qnz74k8AwdOMZqYQ

提取码:cwqb

二、后端代码

1、pom依赖

网上说一大堆的依赖,其实,只需要一个即可。

xml 复制代码
        <dependency>
            <groupId>net.sf.jasperreports</groupId>
            <artifactId>jasperreports</artifactId>
            <version>6.17.0</version>
        </dependency>

2、Jaspersoft Studio生成的jasper文件

3、main程序测试案例

java 复制代码
import net.sf.jasperreports.engine.JREmptyDataSource;
import net.sf.jasperreports.engine.JRException;
import net.sf.jasperreports.engine.JasperExportManager;
import net.sf.jasperreports.engine.JasperFillManager;
import net.sf.jasperreports.engine.JasperPrint;
import org.springframework.util.ResourceUtils;

import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.util.HashMap;
import java.util.Map;

public class Test01 {
	public static void main(String[] args) throws FileNotFoundException, JRException {
		File file = ResourceUtils.getFile("classpath:templates/test01.jasper");
		Map<String,Object> params = new HashMap<>();
		params.put("username","张三");
		params.put("email","[email protected]");
		JasperPrint jasperPrint = JasperFillManager.fillReport(new FileInputStream(file), params, new JREmptyDataSource());
		JasperExportManager.exportReportToPdfFile(jasperPrint,"pdf/test01.pdf");
	}
}

4、解决中文不显示问题

创建目录:src/main/resources/fonts

创建文件:fonts.xml

xml 复制代码
<?xml version="1.0" encoding="UTF-8"?>

<fontFamilies>
    <fontFamily name="黑体"><!--字体名称-->
        <normal>fonts/simhei.ttf</normal><!--字体文件的路径-->
        <bold>fonts/simhei.ttf</bold>
        <italic>fonts/simhei.ttf</italic>
        <boldItalic>fonts/simhei.ttf</boldItalic>
        <pdfEncoding>Identity-H</pdfEncoding><!--这里的定义就与上面1.1的图设置相匹配了-->
        <pdfEmbedded>true</pdfEmbedded>
        <exportFonts>
            <export key="net.sf.jasperreports.html">'黑体', Arial, Helvetica, sans-serif</export>
            <export key="net.sf.jasperreports.xhtml">'黑体', Arial, Helvetica, sans-serif</export>
        </exportFonts>
    </fontFamily>
</fontFamilies>

从windows的目录:C:\Windows\Fonts

中找.ttf文件格式的字体,放入fonts中

添加配置文件:jasperreports_extension.properties

bash 复制代码
net.sf.jasperreports.extension.registry.factory.simple.font.families=net.sf.jasperreports.engine.fonts.SimpleFontExtensionsRegistryFactory
net.sf.jasperreports.extension.simple.font.families.lobstertwo=fonts/fonts.xml

5、web接口案例

java 复制代码
	@GetMapping(value = "/preview/pdf")
	public void preview(HttpServletRequest request, HttpServletResponse response) throws Exception {
//		封装参数	对应jasper report里面的filed
		Map<String,Object> params = new HashMap<>();
		params.put("username","张三");
		params.put("email","[email protected]");
		File file = ResourceUtils.getFile("classpath:templates/test01.jasper");
		request.setCharacterEncoding("utf-8");
		response.setCharacterEncoding("utf-8");
		response.setContentType("text/html");
		response.setContentType("application/pdf");
//		String fileName = new Date()+"测试报告.pdf";
//		设置header的这个属性,就变成了直接下载
//		response.setHeader("content-disposition","attachment;filename="+ URLEncoder.encode(fileName,"utf-8"));
//		new JREmptyDataSource()  给一个空数据源,因为,params已经查询到了具体的数据。
		JasperPrint jasperPrint = JasperFillManager.fillReport(new FileInputStream(file), params, new JREmptyDataSource());
		JasperExportManager.exportReportToPdfStream(jasperPrint,response.getOutputStream());
	}

三、Vue前端代码

这里需要一点axios的基本功。

js 复制代码
      checkPdf().then(res => {
        // 将获取到的PDF文件流转换为Blob对象
        const blob = new Blob([res], { type: 'application/pdf' })
        // 创建一个URL对象
        const urlTwo = URL.createObjectURL(blob)
        // 设置PDF源为创建的URL
        window.open(urlTwo, '_blank')
      })

四、演示效果

相关推荐
心系35 分钟前
vue项目引入marvinJS
前端·vue.js
一只叫煤球的猫35 分钟前
事务原来很简单——SpringBoot中如何正确使用事务
spring boot·后端·面试
李剑一35 分钟前
兄弟们,2025年了!求求你优化一下图片加载吧
前端·vue.js
好柿会發生35 分钟前
关于chartjs的简单使用,各位大佬有知道什么办法通过js设置图表的宽高嘛
javascript·vue.js
前端太佬40 分钟前
Vue3异步数据加载的陷阱与最佳实践:从内存泄漏到优雅实现
前端·javascript·vue.js
howeres41 分钟前
Spring Boot 应用优雅关闭
java·spring boot
前端太佬42 分钟前
v-show 的隐藏魔法:为什么它比 v-if 更“懒”?
前端·javascript·vue.js
南汐以墨1 小时前
Maven与Springboot创建
java·spring boot·maven
秋野酱1 小时前
基于javaweb的SpringBoot儿童爱心管理系统设计与实现(源码+文档+部署讲解)
java·spring boot·后端
Go_going_2 小时前
【解决 el-table 树形数据更新后视图不刷新的问题】
前端·javascript·vue.js