一种用于跨平台跨浏览器在Web应用里进行打印的方法与流程

    专利2022-07-08  110


    本技术涉及不同操作系统平台下的web应用在不同浏览器控制本地打印机的技术,具体为建立一种通用的通信协议,使得各类web应用在跨平台跨浏览器里实现打印效果的一致。



    背景技术:

    当前web应用开发非常流行,主要原因是web应用客户端的规则很简单,容易学习,容易维护,容易发布,降低了开发难度。但是,web应用的打印一直以来却是一个难题,特别是在应用中完成标签打印(如包裹面单、货运标签等)、票据打印(如零售小票)难度较大,其难度在于如何将需要打印的内容,精确套打到标签、票据中,精确控制分页,并实现高速连续打印。

    http是一个客户端(用户)和服务端(网站)之间请求和应答的标准,通常使用tcp协议。由http客户端发起一个请求,创建一个到服务器指定端口(默认是80端口)的tcp连接。http服务器则在那个端口监听客户端的请求。一旦收到请求,服务器会向客户端返回一个状态,比如"http/1.1200ok",以及返回的内容,如请求的文件、错误消息、或者其它信息。很多较老的浏览器,仅支持http协议。

    与http不同,websocket提供全双工通信。websocket是一种网络传输协议,它使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在websocketapi中,浏览器和服务器只需要完成一次握手,两者之间就可以创建持久性的连接,并进行双向数据传输,具有较低的开销,便于实现客户端与服务器的实时数据传输。服务器可以通过标准化的方式来实现,而无需客户端首先请求内容,并允许消息在保持连接打开的同时来回传递。通过这种方式,可以在客户端和服务器之间进行双向持续对话,大多数现代浏览器都支持该协议。



    技术实现要素:

    本发明的目的在于,通过建立一种通用的浏览器与本地或者云端打印机的通信协议和渲染引擎,利用http以及websocket双协议,建立浏览器与安装在某处系统上的打印服务软件的通信,由于通信协议是跨平台跨浏览器支持的,即可实现跨平台跨浏览器打印;通过直接调用系统系统的打印接口,实现一套web应用的内容转换到系统打印机可精准识别的渲染引擎,从而解决上述背景中提出的问题。

    为实现上述目的,本发明提供如下技术方案:利用http以及websocket协议,实现对打印内容的精准控制,同时摒弃了现有控件、插件方案的无法跨平台,开发维护的不便的问题。创造性的利用跨平台跨浏览器支持的http协议和websocket协议,开发一个兼容两种协议的驻守服务,驻守服务可以本地单机部署,也可以独立部署到局域网内,web应用根据需要,自行选择http或者websocket协议,由web端发送指令,通过协议发送给服务端,由服务端的打印模块实现浏览器与打印服务的通信,并实现了一套原生的打印渲染引擎,从而实现web应用对打印的精准控制,实现打印效果的一致性。

    与现有技术相比,本发明的有益效果是,解决了跨平台跨浏览器与打印机通信且保证打印效果的一致性,具有以下优点:

    1.全平台跨浏览器内容一致,所见即所得的html打印,不需要写复杂的画图命令,记复杂的参数,使用html css就可以构造出图文并茂的打印内容,组织打印数据高效、灵活。

    2.功能丰富,贴合需要,比如关联数据字段,样式修改,表格分页,页内独立元素分页,纵、横打印,动态宽高,分页连续精准套打,镜像打印等。

    3.安装、升级、调试方便,技术实现的服务软件只有1.5兆,在用到的软件的系统打印,自动检测未安装就提示下载,或者当有版本升级时监控自动升级,软件可以调试输入内容,方便部署。

    4.支持云打印,打印服务可部署在局域网或者其他网络的任意一台服务器中。如果你需要从其他非windows系统的设备中,比如android、ios、linux设备,可使云打印功能,云打印可以实现服务端集中打印,云端打印机打印,而客户端不必安装。

    5.默认参数自动打印,无预览、无提示直接打印,在web程序进行打印时,经常需要控制一些打印参数,比如,打印到哪个打印机,纸张大小、方向,边距,份数,指定页,是否双面打印,等等。软件可以让你通过程序设置这些默认参数,而不必让用户在弹出的打印机选择对话框中去设置,这样可以跳过打印预览页直接打印,可以极大地提升打印效率。

    附图说明

    图1为本发明核心技术框架;

    图2为操作系统打印结构(以windows系统举例);

    图3为操作系统打印流程(以windows系统举例);

    图4为本发明打印高级分页示意图;

    图5为本发明的基于web浏览器的排版编辑器;

    图6为本发明的技术方案流程示意图。

    具体实施方式

    下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。

    请参阅图1,核心技术框架,本方案依托操作系统提供的打印机接口,由下至上实现了数据渲染引擎、通信服务、web调用接口、排版编辑器,下面依次讲述它们承担的作用及实现方式。

    数据渲染引擎,用于解析基于浏览器的web应用程序发送过来的打印请求和打印内容,并向本地或远程服务器上的打印机发送打印指令和打印内容,是整个技术中最核心的部分。

    操作系统提供了底层的打印接口供上层软件或系统调用,以windows系统举例。

    请参考图2,系统打印结构示意图。说明:

    printdocument:是最重要的类。几乎所有的打印类都与这个类有关系。要打印一个文档,需要printdocument的一个实例。

    printcontroller:类控制打印任务流。提供了打印开始、打印每个页面和打印结束的事件。派生于printcontroller的具体类有standardprintcontroller和previewprintcontroller。

    printsettings:类可以获取打印和设置打印机配置。这个类配置由pagesetupdialog类进行。

    printdialog:类确定使用哪个打印机进行打印和如何配置printersettings。

    graphics:可以访问打印机的设备内容,给打印机发送字符串、线条和曲线。

    pagesetupdialog:设置打印页面。

    printpreviewdialg:打印预览页面。

    请参考图3,系统打印流程示意图,应用程序必须调用printdocument的print()方法,启动调用序列。因为printdocument本身并不负责打印流,所以由printcontroller通过调用这个类的print()方法完成打印。打印控制器现在执行操作,通知printdocument,通过调用onbeginprint()开始打印。如果应用程序在打印任务的开始执行某些操作,就必须在printdocument中注册一个事件处理程序,这样才会在应用程序类中接到通知。如上图中,假定注册了处理程序onbeginprint(),所以这个处理程序应在printdocument类中调用。

    在开始阶段完成后,printcontroller就进入printloop(),为每个要打印的页面调用printdocument类中的onprintpage()方法。onprintpage()调用所有的printpage事件处理程序。必须对每个页面执行这个处理程序,否则就不会打印任何内容。

    可以在printdocument.printpage处理程序中执行打印代码。每个打印页面都要调用该处理程序。如果打印任务只需要执行一次打印代码,就必须执行beginprint和endprint事件和处理程序。在打印完成最后一页后,printcontroller就调用printdocument类中的onendprint()。也可以执行要在这里调用的处理程序。

    因此,要实现打印必须有如下内容:

    1、打印文件档,用于打印机印机。此用printdocument类实例化。

    2、被打印的内容。处理用pintdocument中printpage事件方法得到被打印内容。

    其方法如下:

    1、实例化printdocument类。声明需要打印的文档。

    2、增加printdocument.printpage事件,此事件的方法用于得到被打印的内容。

    3、调用printdocument.print()方法打印内容,在打印之前,此方法会在prntcontroller类的帮助下先呼叫printpage事件的方法。

    4、在printpage事件中绘制打印文本,用于得到打印内容,此方法结束后会回到printdocument.print()方法中,执行打印。

    通过以上处理,我们已经能控制本地或者远程服务器的打印机打印内容了,接下来就是解析浏览器的web应用程序发送过来的打印请求和打印内容,也就是要跟浏览器那边约定一套规则,按规则发送打印数据,便于服务软件识别和解析成打印机能够打印的内容。这里有两种方案,一种是直接打印整个网页,因为操作系统的打印服务提供了直接将网页渲染后打印的能力,是最常见的方式,能解决大部分常见打印场景,缺点是容易收到不同的操作系统、浏览器、分辨率的影响,打印出来的内容可能会有细微的差异。另一种就是在浏览器和打印机之间做一次转换,分解网页里面的各种元素,使用服务软件提供的接口,将网页内容转化为打印机可以识别的文本、线条、图形、图片内容并打印,这种方案对打印的内容控制更精确,适用于各类复杂场景。

    因此,我们的打印接口,javascriptapi提供了以下核心接口:

    ds.html_print,用于直接打印网页内容。

    ds.content_print,用于转换网页内的元素,比如文本、线条、图形、图片、字号、字体,以及它们的坐标位置。

    ds.set_content_print,用于对打印内容进行高级控制,比如普通分页、高级分页、镜像分页等。普通分页比较好理解,就是根据内容和纸张,在需要分页的时候控制分页,高级分页是指比如页面内部分内容是要分页的,参考图4,高级分页示意图,比如页面内的表格内容,随着行数增加需要分页,但是像标题、落款等内容,是需要每页都出现的,这时就可以控制,表格每多少行就就行分页,其他页面内容每页都重复出现。镜像分页是指,有些单据不是可以复写的多层多联,而是上下多联,上下两联的内容是一样的,这时在前面高级分页的基础上,还要将之前分页的每一页内容在上下两联重复,才是打印了一页完整的内容。ds.set_print,用于设置打印参数,比如方向、边距、纸张尺寸。

    web应用根据实际情况,选择不同的接口,提交对网页上内容的打印请求,当服务软件接收到打印请求后,开始渲染内容。那么服务软件如何接收网页提交过来的内容呢,这时需要通信服务了,基于http或者websocket协议的通信服务,负责传递内容。根据使用的场景不同,可以灵活的选择,使用http协议,还是websocket协议,通信协议都是约定俗成的方案,具体实现就不赘述,只要接口选择具体的协议,传递内容的通道就能正常建立。

    现在通道已经建立,web应用可以随时提交打印请求给服务软件,接下来就是确定具体想打印的内容,由于打印内容是面向用户的,不可能要求用户自己按接口规范去写代码控制自己想要的内容,因此就有了排版编辑器,用一种可视化的界面,让用户能灵活的控制打印内容的排版。

    请参考图5,排版编辑器示意图,打印内容的排版,包含两部分,一个是页面版式设计,这部分是固定的,类似于做ppt一样可以便捷的操作;另一个就是页面的组件关联数据字段,这部分内容是动态的,根据实际要打印的内容变化。比如,零售门店打印的销售单票据,实付金额是一个页面组件,除了决定这个组件的位置、大小、字体,还要给这个组件关联订单里边的实付金额这个数据字段,这样在web应用打印单据的时候,就可以实时的将页面上的组件替换成每一个单据对应的真实数据。排版编辑器可以保存多套模版,根据不同的打印场景选择不同的模版,模版可以导入导出,方便在不同的设备间快速迁移。

    请参考图6,最终的技术方案流程示意图,本地的计算机以及远程服务器都可以安装打印服务软件,它们都连接打印机,本地计算机可以直接向连接在本机的打印机提交打印任务,也可以向云端的远程服务器提交打印任务;局域网内的笔记本计算机、手机等移动设备,也可以向本地计算机提交打印任务,也可以向云端的远程服务器提交打印任务。提交打印任务之前,需要先用排版编辑器创建打印模版,之后各类设备都能通过打印模版向安装了打印服务并连接打印机的设备提交打印内容,打印服务接收到打印内容后,打印渲染引擎解析打印内容,转换成打印机可识别的数据,从而打印出一致的内容。

    尽管已经示出和描述了本发明的实施例,对于本领域的普通技术人员而言,可以理解在不脱离本发明的原理和精神的情况下可以对这些实施例进行多种变化、修改、替换和变型,本发明的范围由所附权利要求及其等同物限定。


    技术特征:

    1.一种浏览器web应用控制系统打印机的技术方案,其特征在于,包括:

    接收用户在浏览器发起的打印请求;

    建立传输渠道,调用打印服务提供的接口,并将用户发起的打印请求传输给打印机;

    将打印机将要接收到的打印请求,转化为打印机可以识别的内容;

    调用打印机,执行打印过程,打印出与用户请求一致的结果。

    2.根据权利1要求所述的方法,其特征在于,接收用户在浏览器发起的打印请求之前,还包括:

    提供用户用于预览将要提交的打印请求所包含的内容样式;

    提供用户在预览打印请求包含内容后,允许用户调整打印内容样式的方法;

    提供用户保存打印内容样式的方法,并让该样式在需要的地方都可以使用;

    在用户提交打印请求之前,让用户所见即所得的明确将要打印出来的内容与自己想要的内容是否一致,若是,创建打印请求,若不是,则可以继续调整内容;

    以及,当用户在不同的操作系统平台的不同浏览器下,都能完全一致的进行上述操作。

    3.根据权利1要求所述的方法,其特征在于,建立传输渠道,调用打印服务提供的接口之前,还包括:

    调用操作系统提供的打印接口,列出可用打印机,并选择打印机发送打印指令;

    提供不同浏览器都可识别的通信协议,包括http和websocket;

    可随时验证基于所选通信协议的传输渠道是否建立;

    提供web应用开发人员可以理解和使用的开发接口,以及接口的调用方式说明;

    提供基于开发接口的测试数据案例,以及故障处理方案。

    4.根据权利1要求所述的方法,其特征在于,将用户发起的打印请求传输给打印机之前,还包括:

    检测本地或远程计算机环境中是安装部署打印服务客户端,若未部署,则提供下载安装的方法;

    检测本地或远程计算机环境中的打印服务客户端是否有新版,若有,则提供更新方法;

    检测本地或远程计算机环境中的打印服务客户端是否有故障,若有,则提供检测和修复方法。

    5.根据权利1要求所述的方法,其特征在于,所述方法还包括:

    解析用户从web应用提交到打印服务客户端的打印内容和打印设置;

    将解析出来的打印内容渲染成打印机可以打印的内容;

    将解析出来的打印设置传递给打印机。

    6.根据权利1要求所述的方法,其特征在于,所述方法还包括:

    打印服务客户端的渲染方法可以确保在不同操作系统和不同浏览器提交过来的相同打印内容,打印出来的结果一致;

    当相同内容的打印结果不一致时,提供可行的解决方法。

    7.一种跨平台跨浏览器的技术,其特征在于,所述技术并不限定具体操作系统,以及操作系统运行的浏览器。

    8.web应用,其特征在于,所述应用必须都运行在浏览器里面,通过网址或者ip地址访问,有些应用还会要求必须登录获得授权后,才能使用。

    9.一种打印技术,其特征在于,所述技术需要通过系统和客户端,控制连接在本地计算机或者远程服务器上的打印机执行打印。

    技术总结
    本发明提供了一种浏览器Web应用控制系统打印机的技术方案、系统和用户客户端,其中,技术方案包括:浏览器与系统通信的协议、把浏览器的打印内容解析为打印机可识别内容的渲染引擎、打印控制接口;其中,系统包括一套可视化的网页排版引擎,可管理打印内容的样式和打印模版;其中,用户客户端包括一个本地运行的打印服务软件,用于在本地计算机或者远程服务器安装,实现技术方案中包含的各项内容。本申请实例达到了提升Web应用跨平台跨浏览器打印的一致性和精准性问题,并能解决复杂打印场景下的诸多问题。

    技术研发人员:谈超
    受保护的技术使用者:武汉点石互动网络科技有限公司
    技术研发日:2020.12.18
    技术公布日:2021.03.12

    转载请注明原文地址:https://wp.8miu.com/read-23551.html

    最新回复(0)