node.js基于前端技术生成PDF方案我的前端之路

报告生成需要对第一步生成的HTML进行PDF的转换生成,HTML2PDF的方式又分为两种:

由于HTML文档再浏览器中是以DOM树的形式存在,所以我们可以通过三步完成HTML到PDF的转换:

截图如下,点击下载按钮可进行pdf生产:

该方案完全基于客户端的方式生成,不需要服务器进行支持。在使用该方案的过程中,发现了一些问题:

puppeteer是google推出的headless浏览器,即没有图形界面的浏览器,但又可以实现普通浏览器HTML/JS/CSS的渲染,以及其他基本浏览器功能。你可以理解为一个没有界面的Chrome浏览器。主要有以下几种使用场景:

通过理解puppeteer的功能,我们可以开启一个实例去渲染HTML报告,然后再利用其提供的转换PDF功能进行PDF的生成。

两个重要的API:

puppeteer使用一个小例子,将百度网页转换为pdf:

完整代码如下:

项目启动流程如下:

整个服务架构如下:

在实际环境中,前端页面可部署在nginx服务器上或者直接放在Node服务器上,puppeteer也支持使用cookie的操作,这样可以避免一些需要身份认证的问题。

相比客户端生成方式,使用puppeteer生成的pdf质量比较高,可满足生产要求。

本文中提到的两种方案中,均省去了ajax后端请求数据部分,读者可根据需要自行增加。

我是一个爱生活,爱摄影,爱代码的前端工程师。我要成为这个宇宙最牛逼的大神。

THE END
1.降体检中心信息化建设方案书.pdf免费在线阅读直接上载到体检人员的 体检 项目相应栏目中; 6. 数据加工:系统完整的收集了体检的原始信息,配合各种管理模式,为受检者提供不 同层次 的健康指导和分析统计,可进行各类综合统计与分析,通过分析,为体检单位提供 符合客观实际 的职工健康情况分析报告,为体检单位提供准确的决策信息; 三、 系统构成 根据体检中心当前及...https://max.book118.com/html/2018/0412/161249531.shtm
2.这次必须差评!体检完告诉我不需要取报告,体检完告诉我不需要取报告,可以网上下载,结果手机关注公众号,只能一页页看,不能下载,不能保存,连个PDF格式都没有! 想着用电脑试试吧,结果也不能下载,问客服,客服居然说只能看!让我自己复制粘贴到文档再保存!那体检指标是不是就可以随意改动了? 客服态度很一般,认为这是理所当然的。 都什么年代了,还是这种...https://m.dianping.com/review/672667460
3.中医体检报告.docx中医体检报告概述中医体检报告是一种通过中医理论和方法对个体进行体检并生成报告的健康管理工具。中医体检注重整体观察和辨证施治,通过对人体脏腑经络的观察和判断,综合分析个体的体质和健康状况。本报告旨在通过中医体检来评估个体的健康状况和病理特点,并提供相应的中医调理方案,以促进个体的健康管理和疾病防治。体检结果...https://www.renrendoc.com/paper/306586708.html
1.Word报告自动生成(例如导出数据库结构)腾讯云开发者社区将很早之前写的一个小组件重新整理优化一下,做成一个通用的功能。适用于导出数据库的结构(表、字段等)到Word或将体检数据自动生成Word版的体检报告等。代码:Github 一、主要需要完成功能: 1. 灵活的配置规则及word样式设置(文本、表格、图表、颜色等). https://cloud.tencent.com/developer/article/1372086
2.电子病历共享应用" } ? 3.2 体检pdf文档上传接口 使用场景:患者体检报告生成后,第一时间上传体检pdf报告,此接口入参不加密.具体实现请参照附件中 UpPdfReportToServerDemo.java 和 UpPdfReportToServerDemo.cs 接口地址:http://132.83.19.55:8086/v1/healthPatientEmr/upPdfHealthExaminationReport 入参 参数名 hospitalCode ...https://sbgysfw.sysc.tsinghua.edu.cn/tsinghua.war/tsinghua.api/file/39351f5e53d24e9d93390510ba18035a
3.jwt,token,cookiesession总结,JwtUtil.java编写,jwt应用业务场景:微信H5中无法下载文件,用户下载体检报告时我是先判断访问来源,如果是微信访问的话提示用户右上角在浏览器打开链接下载,在浏览器访问pdf报告下载链接由于不需要二次登录,直接传递体检编号的话存在遍历风险,传递加密的体检编号,下载时在解密可以做到遍历风险,但是这个加密字符串是一直有效的,用户保存起来可以随时下...https://blog.csdn.net/qq445829096/article/details/116228736
4.爱康体检报告如何下载pdf格式爱康体检报告怎么下载电子版接下来我将教大家下载体检报告的功能操作。 金融软件首页,点击“报告”。 如果体检报告结果已经出来。点击右上角“更多”,看到“查看PDF报告”就可以下载保存到手机里面了。https://m.liqucn.com/article/131143.wml