使用js在前端web页面调用打印机

最近参与了一个比较老的项目改造,需要使用到打印机相关的技术。
由于打印机也是比较老旧,所以没有SDK相关的应用,虽然有桌面的插件,但是需要集成到web中来,最终找到了lodop这个万能驱动。
这个是打印机是针式的,所以总结了以下一些方法,目前对我来说是够用了。

安装:

在http://www.lodop.net/download.html的官网主页下载发行包
安装之后启动就可以了,然后调用下面的方法来实现打印。

方法函数

getLodop() 初始化打印控件

PRINT_INIT(name) 初始化打印, name: 打印文档名称,该名称可在打印设备队列中看到

GET_PRINTER_COUNT() 获得打印机个数

GET_PRINTER_NAME(intPrinterIndex) 用序号获得打印机名,一般序号从0开始,-1特指默认打印机;
SET_PRINTER_INDEX() 按序号或名称指定打印机,选定后禁止手工重选;一般设置为-1,用于指定使用默认打印机

SET_PRINT_STYLE(attr, value) 设置基本打印样式
attr: 属性, FontSize、FontColor等
value: 属性值
SET_PRINT_STYLEA(index, attr, value) 设置具体某条打印样式
index: 索引,0是最近一条的样式,序号1开始
attr: 属性, FontSize、FontColor等
value: 属性值

SET_PRINT_PAGESIZE(intOrient,intPageWidth,intPageHeight,strPageName) 设定纸张大小
intOrient:打印方向及纸张类型
1—纵向打印,固定纸张;
2—横向打印,固定纸张;
3—纵向打印,宽度固定,高度按打印内容的高度自适应
0—方向不定,由操作者自行选择或按打印机缺省设置。
intPageWidth:
纸张宽,单位为0.1mm 譬如该参数值为45,则表示4.5mm,计量精度是0.1mm。
intPageHeight:
固定纸张时该参数是纸张高;高度自适应时该参数是纸张底边的空白高,计量单位与纸张宽一样。
strPageName:
纸张类型名, intPageWidth等于零时本参数才有效,具体名称参见操作系统打印服务属性中的格式定义。
关键字“CreateCustomPage”会在系统内建立一个名称为“LodopCustomPage”自定义纸张类型。

ADD_PRINT_TEXT(top, left, width, height, text) // 添加打印文本
top: 距离纸张顶部的距离
left: 距离纸张左边的距离
width: 当前文本的宽度 如果宽度小于字符长度则会被隐藏
height: 当前文本的高度 高度小于字符高度没有影响
text: 文本字符串

ADD_PRINT_TABLE(top, left, width, height, tableDom) 打印表格,可打印HTML绘制的表格
top: 距离纸张顶部的距离
left: 距离纸张左边的距离
width: 当前文本的宽度 使用百分比更好
height: 当前文本的高度 使用百分比更好
tableDom: table的dom元素

ADD_PRINT_HTM(top, left, width, height, dom); 打印HTML元素,不可以打印css画出来的椭圆
top: 距离纸张顶部的距离
left: 距离纸张左边的距离
width: 当前元素的宽度
height: 当前元素的高度
dom: dom元素

NewPage() 添加新的一页,比较适合用于续打

PREVIEW() 打印预览

PRINT() 直接打印

PRINT_DESIGN() 打印设计,可以设计模板然后生成代码直接用

示例

function templatePrint() {
    // 初始化打印机
    let LODOP = getLodop();
    // 初始化打印名称
    LODOP.PRINT_INIT('测试打印')
    LODOP.SET_PRINTER_INDEX(-1)  // 设置使用的打印机,-1表示使用默认打印机
    LODOP.SET_PRINT_STYLE('FontSize', 24);  // 设置基本样式,字体大小24
    LODOP.SET_PRINT_PAGESIZE(1, 2100, 2970, 'CreateCustomPage') // 设置打印方向和纸张大小
    // LODOP.SET_PRINT_PAGESIZE(1, 0, 0, 'A4') // 直接设置A4纸规格
    LODOP.ADD_PRINT_TEXT(100, 100, 500, 20, '测试文本1');  // 添加打印文字
    LODOP.ADD_PRINT_TEXT(200, 100, 500, 20, '测试文本2');  // 添加打印文字
    LODOP.SET_PRINT_STYLEA(2, 'FontSize', 24); // 指定第二条的字体样式
    LODOP.NewPage()  // 添加一页,续打
    LODOP.ADD_PRINT_TABLE(0, 0, "100%", '100%', dom);  // 打印表格
    LODOP.NewPage() // 添加一页,续打
    LODOP.ADD_PRINT_HTM(0, 0, 500, 100, dom);  // 打印HTML内容
    LODOP.PREVIEW()  // 打印预览
    // LODOP.PRINT()  // 直接打印
    // LODOP.PRINT_DESIGN()  // 打印设计
}
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐