Docker 快速验证 HTML 导出 PDF 高效方案
需求分析
项目中用到了 Echarts，想要把图文混排，当然包括 echarts 生成的 Canvas 图也导出 PDF。
设计和实现时，分析了 POI、iText、freemaker、world 的 xml 模版、Jquery-printArea.js、JQuery Plugin-TableExport、flying saucer 等等技术组合，不尽人意。甚至因为 echarts 不支持后端调用导出图片（没有简单易行的办法），一度考虑要在导出时用 JfreeCharts 重新画一遍图表。一是不能完整体现原有设计样式，二是工期不支持这么庞大的工作量（硬撸代码解析html生成 word 或 pdf。好吧，也同时觉得挺low的）；
最终选择了 wkhtmltopdf，实现了预期目标。整理成笔记，分享给大家。同时，发现 docker hub 有 wkhtmltopdf 基于 apline 搭建的 web service 镜像，生产环境可以上 Docker 的同学有福了，这应该是个更加高效的方案。后续考虑整合到支撑平台中，一并开源出来。
笔记本实验
本地测试为Mac Book，生产环境请自行评估调整。
下载和安装
B4下，brew仓库里居然没有，所以 brew install wkhtmltopdf安装报错。
直接贴官方链接了：有依赖亲自行安装依赖；
验证
ChinaDreams:workspace kangcunhua$ wkhtmltopdf --version wkhtmltopdf 0.12.4 (with patched qt)
测试
联网抓取
ChinaDreams:~ kangcunhua$ wkhtmltopdf --header-center '报表' --outline --header-line --margin-top 2cm --header-line http://www.qq.com/ qq.pdf
本地页面测试
index.html 见静态页面
–zoom 4 是 Mac book 上实验出来的参数，这样页面是正常 A4 宽幅；在 windows10、Suse 11 下不用加这个参数。
toc 参数生成目录，包括左侧导航；—toc-header-text 自定义目录名；
ChinaDreams:~ kangcunhua$ wkhtmltopdf --zoom 4 toc --toc-header-text "第四季度季报" index.html export.pdf
模拟商业环境
我们拿到项目中实践验证下方案。商业项目，往往是残酷的要求，会遇到各种各样demo时碰不上的挑战。
思路还是先用docker神器，模拟商业环境，验证方案，然后再修订验证后的方案到正式项目环境验证。
客户方提供的环境是SuSE。我们先来看看是哪个版本
cat /etc/SuSE-release # 可以看到补丁版本 SUSE LINUX Enterprise Server 11 (x86_64) VERSION = 11 PATCHLEVEL = 4
请 Docker 神器
查找 SuSE 镜像，恰好有一个11版本的，下载镜像先
$ docker search SUSE # yuzhenpin/suse-11-sp3-x86_64-java $ docker pull yuzhenpin/suse-11-sp3-x86_64-java
启动镜像
docker run --name suse-ep -it yuzhenpin/suse-11-sp3-x86_64-java /bin/bash 9e023776a1d5:/ # java -version java version "1.7.0_51" Java(TM) SE Runtime Environment (build 1.7.0_51-b13) Java HotSpot(TM) 64-Bit Server VM (build 24.51-b03, mixed mode) 9e023776a1d5:/ # id uid=0(root) gid=0(root) groups=0(root) 9e023776a1d5:/ # groupadd prms && useradd -d /prms -g prms -m prms 9e023776a1d5:/ # passwd prms 9e023776a1d5:/ # su prms
安装和配置
因为下载的二进制版本的，直接把 wkhtmltopdf 拷贝进容器即可。index.html 是写的测试页面，后文附有源码：此文件用到的 jquery 相关 js 直接引用了 CDN，故实验在联网环境下进行的。
ChinaDreams:copy2docker kangcunhua$ docker cp wkhtmltox-0.12.4_linux-generic-amd64.tar.xz su-ext:/prms/workspace ChinaDreams:copy2docker kangcunhua$ docker cp index.html su-ext:/prms/workspace
检查运行依赖
使用 ldd 命令，not found 的就是对应的依赖包不存在：
7d183ecb0026:/prms/workspace/wkhtmltox/bin # ldd wkhtmltopdf linux-vdso.so.1 => (0x00007ffe40bd2000)libXrender.so.1 => not foundlibfontconfig.so.1 => not foundlibfreetype.so.6 => not foundlibXext.so.6 => not foundlibX11.so.6 => not foundlibz.so.1 => /lib64/libz.so.1 (0x00007f9ca59ad000)libdl.so.2 => /lib64/libdl.so.2 (0x00007f9ca57a9000)librt.so.1 => /lib64/librt.so.1 (0x00007f9ca55a0000)libpthread.so.0 => /lib64/libpthread.so.0 (0x00007f9ca5383000)libstdc++.so.6 => /usr/lib64/libstdc++.so.6 (0x00007f9ca507b000)libm.so.6 => /lib64/libm.so.6 (0x00007f9ca4e02000)libgcc_s.so.1 => /lib64/libgcc_s.so.1 (0x00007f9ca4bec000)libc.so.6 => /lib64/libc.so.6 (0x00007f9ca4870000)/lib64/ld-linux-x86-64.so.2 (0x00007f9ca5bc5000)
安装依赖
使用 zypper se 命令查找，根据查找结果，来安装需要的版本；
7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper se libXrender 7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper install xorg-x11-libXrender 7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper se libfreetype 7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper install libfreetype6 7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper se libXext 7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper install xorg-x11-libXext 7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper se fontconfig 7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper install fontconfig 7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper se libX11 7d183ecb0026:/prms/workspace/wkhtmltox/bin # zypper install xorg-x11-libX11
需要在 html 代码中指定 font-face，所以需要一种支持中英文的字体。这里不指定的话，中英文都是黑色方框。因为不知容器使用的是何种字体，没找到Suse如何查看当前已有字体。从网下下载了文泉驿正黑，cp 了字体进来，发现是乱码，mv 重命名为 tt.tff；cp 到字体目录。
7d183ecb0026:/usr/share/fonts # mkdir windows 7d183ecb0026:/prms/workspace # mv tt.ttf /usr/share/fonts/windows/ 7d183ecb0026:/prms/workspace # ./wkhtmltox/bin/wkhtmltopdf index.html exp.pdf QIconvCodec::convertToUnicode: using Latin-1 for conversion, iconv_open failed QIconvCodec::convertFromUnicode: using Latin-1 for conversion, iconv_open failed Loading pages (1/6) Counting pages (2/6) Resolving links (4/6) Loading headers and footers (5/6) Printing pages (6/6) Done
和容器之间复制文件
ChinaDreams:copy2docker kangcunhua$ docker cp wkhtmltox-0.12.4_linux-generic-amd64.tar.xz su-ext:/prms/workspace ChinaDreams:copy2docker kangcunhua$ docker cp index.html su-ext:/prms/workspace ChinaDreams:copy2docker kangcunhua$ docker cp 文泉驿等宽正黑.ttf su-ext:/prms/workspace ChinaDreams:copy2docker kangcunhua$ docker cp su-ext:/prms/workspace/exp.pdf .
商业环境实战
待补充。
2017.11.10update: 商业环境最大的挑战是内网。还有个挑战是客户使用的是SuSE Enterprise，这种情况下，如果缺少依赖，补丁包安装很麻烦。
通过走手续，在内网申请了wkhtmltopdf二进制包，工程师传到测试环境，直接运行了测试命令，居然一条就过！依赖不缺，甚至中文字体也不缺。这只能说是运气。不过，凡事预则立，多准备一些，事情周密一些总是没错的。
接下来，就是撰写个工具类调用shell命令了，可能还要考虑权限认证的问题。不过，从前台登录后的UI发起导出，应该不会存在需要认证的问题。
皆大欢喜！
错误、参考和源码
报错：SslHandshakeFailedError
笔记本实验时，报了个错。貌似也不影响最终需要的导出PDF结果。后来猜测应该是页面上有button或与打印无关的js导致的，删了就好了。国外的网友写了一个工具carleton/moodle-scraper，也碰上了这个问题：这个错误貌似不是我第一个碰上，官方也没有修复。
moodle-scraper的KNOWN CURRENT ISSUES
WebToPDF KNOWN CURRENT ISSUES: 1) "Issue found on page:wkhtmltopdf reported an error: Mon Mar 28 20:51:52 unreg-30-152.dyn.carleton.edu wkhtmltopdf[3817] <Error>: CGContextSetShouldAntialias: invalid context 0x0" As of Spring 2016 this problem has not been solved and seems to be a problem with whtmltopdf using a deprecated library of Mac OSX. Try it with Windows and see if it breaks? Additionally, reported issue on GitHub: https://github.com/wkhtmltopdf/wkhtmltopdf/issues/2196
报错信息：
Loading pages (1/6) ^C===========================> ] 48% ChinaDreams:WebRoot kangcunhua$ wkhtmltopdf --disable-smart-shrinking index.html export.pdf Loading pages (1/6) QFont::setPixelSize: Pixel size <= 0 (0) ] 49% Counting pages (2/6) QFont::setPixelSize: Pixel size <= 0 (0)=====================] Object 1 of 1 Resolving links (4/6) Loading headers and footers (5/6) Printing pages (6/6) Nov 7 13:53:25 wkhtmltopdf[2603] <Error>: CGContextSetShouldAntialias: invalid context 0x0. If you want to see the backtrace, please set CG_CONTEXT_SHOW_BACKTRACE environmental variable. Nov 7 13:53:25 wkhtmltopdf[2603] <Error>: CGContextSetShouldSmoothFonts: invalid context 0x0. If you want to see the backtrace, please set CG_CONTEXT_SHOW_BACKTRACE environmental variable. Nov 7 13:53:25 wkhtmltopdf[2603] <Error>: CGContextSetFillColorSpace: invalid context 0x0. If you want to see the backtrace, please set CG_CONTEXT_SHOW_BACKTRACE environmental variable. Nov 7 13:53:25 wkhtmltopdf[2603] <Error>: CGContextSetFillColor: invalid context 0x0. If you want to see the backtrace, please set CG_CONTEXT_SHOW_BACKTRACE environmental variable. Done Exit with code 1 due to network error: SslHandshakeFailedError
报错 convertToUnicode：
在容器中，配置好之后，运行转换命令，报了一个错误，但从结果来看，不影响最终 pdf 生产。故此处没有特殊处理，不过网友给出了解决方案：强迫症或时间充分的网友可以自行验证和修复：
7d183ecb0026:/prms/workspace # ./wkhtmltox/bin/wkhtmltopdf index.html exp.pdf QIconvCodec::convertToUnicode: using Latin-1 for conversion, iconv_open failed QIconvCodec::convertFromUnicode: using Latin-1 for conversion, iconv_open failed Loading pages (1/6) Counting pages (2/6) Resolving links (4/6) Loading headers and footers (5/6) Printing pages (6/6) Done
注意上文报了一个 Qt 错误，
QIconvCodec::convertToUnicode: using Latin-1 for conversion, iconv_open failed QIconvCodec::convertFromUnicode: using Latin-1 for conversion, iconv_open failed
这是个Qt移植错误：
下载 http://ftp.gnu.org/gnu/libiconv/libiconv-1.14.tar.gz
> ./configure -prefix=$PWD/_install -host=arm-linux-gnueabihf > make > make install
把 _install/lib 下的 preloadable_libiconv.so 拷到系统的 /system/lib 下,
export LD_PRELOAD=/system/lib/preloadable_libiconv.so
参考链接1
感谢各位勇于分享的亲：
- jquery PrintArea 实现票据的套打功能(代码)
- 通過選擇 excel 文件或輸入 json 數據，自動生成圖表工具
- FreeMarker + xml 导出 word
- How To Convert an HTML Table into an XML File
- 这篇附有 C# 源码，直接转换 table 的 html 代码为 word 的 xml 格式，我一开始最想解决的办法，可惜没有 Java 版的。自己硬撸又来不及；最终放弃。
- flying saucer html 转 pdf 经验分享
- 最好用 Html 转 pdf 的工具——wkhtmltopdf
- wkhtmltopdf 参数介绍
- HTML 转 PDF 排雷 之 wkhtmltopdf 转换得到的 PDF 没有内容
- wkhtmltopdf 解决分页问题
- wkhtmltopdf 有个很好的方法，就是在那个div的样式后添加一个：page-break-inside:avoid;就ok了。
- iText 和 flying saucer 结合生成 pdf 的技术
- web 打印一篇就够，jspdf，wkhtmltopdf
- 使用 wkhtmltopdf 将 html 转为 pdf ：
- 这篇文章直接指出了 wkhtml 支持 echarts 的 canvas 标签，哇哈哈:)
- HTML转 PDF 工具（wkhtmltopdf）介绍，支持 widows 和 linux
- html 的 table 中不能用 thead，用了后换页会出现两个表头问题如图
- 可以用 thead，不过得加样式 tr { page-break-inside: avoid !important;}
- wkhtmltoxwkhtmltopdf linux 安装
- php扩展 php-wkhtmltox 项目主页： https://github.com/mreiferson/php-wkhtmltox
参考链接2
wkhtmltopdf网页转PDF程序安装教程
linux下查看yum/rpm/dpkg某软件是否已安装的方法
Error while loading shared libraries: libXrender.so.1 on Linux
静态页面
<html><head><meta http-equiv="Content_Type" content="text/html" charset="UTF-8"><title>My JSP 'index.jsp' starting page</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="export echarts to pdf"><script src="http://code.jquery.com/jquery-1.9.1.js"></script><script type="text/javascript" src="https://cdn.bootcss.com/echarts/3.7.2/echarts.simple.min.js"></script>
</head><style type="text/css">@font-face{font-family: Simsun;src:url(“/usr/share/fonts/windows/tt.ttf”)}body{font-family: tt ;}div{page-break-inside:avoid;} table{page-break-inside:avoid;}td{border:1px solid #F00}</style><body><H1>First Title</H1><p>测试:test</p><p>by kang.cunhua;</p><H2>二级标题</H2><pre>正文：轻轻的我走了，正如我轻轻的来；我轻轻的招手，作别西天的云彩。----那河畔的金柳，是夕阳中的新娘；波光里的艳影，在我的心头荡漾。----软泥上的青荇⑴，油油的在水底招摇⑵；在康河的柔波里，我甘心做一条水草！----那榆荫下的一潭，不是清泉，是天上虹；揉碎在浮藻间，沉淀着彩虹似的梦。</pre><H3>三级标题</H3><table border="0" cellpadding="0" cellspacing="0"><tr><td>第一行第一列</td><td colspan="2" align="center">第一行第一列</td><td>第一行第一列</td><td>第一行第一列</td></tr><tr><td>第一行第一列</td><td>第一行第一列</td><td>第一行第一列</td><td>第一行第一列</td><td>第一行第一列</td></tr><tr><td>第一行第一列</td><td>第一行第一列</td><td>第一行第一列</td><td>第一行第一列</td><td>第一行第一列</td></tr></table><!-- 为ECharts准备一个具备大小（宽高）的Dom --><H4>四级标题</H4><div id="main" style="width: 600px;height:400px;"></div><script type="text/javascript">// 基于准备好的dom，初始化echarts实例var myChart = echarts.init(document.getElementById('main'));// 指定图表的配置项和数据var option = {title: {text: 'ECharts 入门示例'},tooltip: {},legend: {data:['销量']},xAxis: {data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]},yAxis: {},series: [{name: '销量',type: 'bar',data: [5, 20, 36, 10, 10, 20]}]};// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);</script>
</body>
</html>
# 离线 # docke51Reboot Docker +K8s 课程正在火热招生中，有需求的小伙伴可以了解一下
docker + k8s
此课程为网络直播课程，一共 10 个课时，每周上一个全天，历时两个多月。附加：录播视频+笔记+除课堂外的答疑时间（7次+）2019-1-13 开课，原价 5800 ，现在周年活动 100 定金抵 800
课程主讲师：GY 老师
10年一线软件开发经验，先后经历了传统安全公司，以及多家互联网公司；在安全开发方面，曾开发过 Linux 防火墙、web 应用防火墙、Linux 安全内核加固，基于大流量的 Web 安全威胁分析等项目；在互联网公司工作时，曾基于 DPDK 高性能网络开发框架开发过基于全流量的网络流量分析平台和基于 Sflow 网络流量分析平台，基于 Golang 开发SmartDNS 等；开发语言也是从C -> python -> golang 的转变过程？现从事基于 K8S 和 Docker在私有云平台建设方面的研发工作；具备丰富的Linux系统开发经验、网络开发经验以及项目管理经验；目前开发工作90+% 都在用 Golang，Golang 是一门简洁、高效、强大且灵活的编程语言。
关于课程的具体内容想要了解的, 扫码加小助手咨询
转载于:https://www.cnblogs.com/reboot51/p/10281059.html
Docker 快速验证 HTML 导出 PDF 高效方案相关推荐
- Docker快速验证tomcat单机多实例方案
为什么80%的码农都做不了架构师?>>> Docker快速验证tomcat单机多实例方案 [TOC] 概述 主要讲的是解决问题的思路.当然也附带了尽可能详细的步骤,感兴趣的童鞋 ...
- cad导出pdf_如何使用浩辰CAD看图王软件来快速导出PDF功能？
浩辰CAD旗下产品都是具有导出PDF功能的,如果是浩辰CAD平台软件或者专业软件选择 dwg to pdf 打印机,就可以输出pdf文件,如果是浩辰CAD看图王则直接就有导出PDF的功能. 浩辰CAD ...
- java 通过模板生成导出PDF方案对比
需求背景 目前项目中有通过 上传word模板,结合用户填写数据,导出渲染后的PDF数据,提升数据安全性.现记录一下使用过程及遇到的问题 项目方案 Adobe Acrobat Pro 打开刚刚制作的pd ...
- Vue3导出pdf方案
Vue3导出pdf方案 1.引入两个依赖 npm i html2canvas npm i jspdf 2.在utils文件夹下新建htmlToPdf.js文件 // 页面导出为pdf格式 import ...
- Java快速实现导出PDF功能
Word转PDF并导出–Windows环境实现 一.制作word模板,这里需要文件后缀默认是.docx,${xxxx}是需要替换的内容 二.添加poi所需要的jar包文件,这里使用maven进行jar ...
- Docker快速入门
Docker快速入门 学习资料: [狂神说Java]Docker最新超详细版教程通俗易懂_哔哩哔哩_bilibili 文章目录 Docker快速入门 1.Docker概述 1.1 Docker 为 ...
- Docker快速入门总结笔记
文章目录 1. Docker概述 2. 虚拟化技术和容器化技术 3. Docker的基本组成 4. Docker的安装 5. Docker的卸载 6. 配置阿里云镜像加速 8. Docker容器运行流 ...
- Docker快速入门总结
目录 Docker快速入门总结 1.Docker概述 2.虚拟化技术和容器化技术 3.Docker的基本组成 4.Docker的安装 5.Docker的卸载 6.配置阿里云镜像加速 7.Docker容 ...
- 快速验证业务决策，“玩转”用户增长
背景 闲鱼目前已经是国内最大的闲置物品交易平台,每天都有数以千万计的用户过来闲鱼,以C2C交易为主.在闲鱼里面,用户的C2C购物频率其实是很低的,而纯粹地逛商品feed流是一件挺无聊的事情.在业务上做 ...
最新文章
- 人工智能时代，企业的未来离不开云专线
- mysql讀取sql_SQL 2008连接读取mysql数据的方法
- 栈和队列----用栈求解汉诺塔问题
- 蓝牙模块音频BLE数据数传串口AT指令的使用方法
- 性能为MySQL 10倍！阿里云推出云原生数据仓库AnalyticDB基础版
- c语言sgoto 标志位,如何在Go中设置TCP数据包的“不分段”标志位？(How to set “don't fragment” flag bit for TCP packet in Go?)...
- spring boot 2.0 与FASTDFS进行整合
- 以太坊概念知识入门篇
- OpenCV能调用的摄像头类型
- xsl判断节点存在_[剑指offer]25删除链表中重复的节点
- Java数据库操作要点
- 武汉大学953计算机综合真题,武大电力系统分析实验报告.docx
- SSD固态硬盘健康状况检测工具SSDReporter
- java fastfds操作文件
- 【WIN10】PS/2 标准键盘鼠标带感叹号(代码10，39)（适用于红米G）
- Mac流程图制作工具推荐——Diagrams
- 【解决】Error loading the file ‘Assets/.../Scene.unity‘. File is either empty or corrupted, please......
- 洛谷 P1719 最大加权矩形
- 拉我室友打了一把英雄联盟搞会了IntelliJ IDEA的安装与配置
- ad17 linux 版本,Altium Designer更新得那么快，到底应该用哪个版本？