使用pdf.js插件与LODOP控件实现前端浏览器静默打印PDF文件

任务： 作为智能终端自助打印系统的一部分，需在前端浏览器打印从服务端获取的Base64编码形式的pdf文件。
实现原理： 页面javaScrip通过atob函数将服务端获取的base64编码转换为pdf文件对象，使用pdf.js API加载到页面元素，转为png图片的Base64编码，调用LODOP控件预览打印或直接打印。
运行环境： Firefox，IE，Chrome
编码语言： JavaScript html5

插件介绍：
pdf.js插件：前端页面纯js查看与打印插件。提供多种API用于pdf文件的加载与展示。
LODOP自助打印控件：可代码定制化的打印控件，需在前端windows系统作为第三方软件安装。

1. 配置pdf.js环境。

将pdf.js版本pdfjs-1.5.188-dist解压，其下有两个文件夹build与web，拷贝到项目路径中。

    pdfjs
      ├── build -
      │     ├─ pdf.js
      │     └─ pdf.worker.js
      ├── web +
      └── LICENSE

A. 页面中导入build文件夹下两个js文件：

B. 中放置一个隐藏的canvas元素

C.初始化pdf.js工具

2.安装并配置LODOP打印控件

A. 在需要静默打印的前端系统安装LODOP控件。（见LODOP官网）

B. 在项目路径中放置LODOP提供的LodopFuncs.js文件

    lodop
      └── LodopFuncs.js

C. 页面 添加LODOP插件：

3.调用打印流程

A. pdf文件Base64编码转换为pdf文件对象

B. 调用pdf.js API将pdf文件对象加载到 元素

C. 打印函数 / 预览函数（见步骤B），调用LODOP控件打印Base64图片

---

源码: 码云