【技术实现步骤摘要】
基于canvas的动态网页打印方法、系统及存储介质
[0001]本专利技术涉及计算机网络
,尤其涉及一种基于canvas的动态网页打印方法、系统及存储介质。
技术介绍
[0002]随着计算机网络
的发展,越来越多的网站采用异步加载方式,如越来越多的网站通过JavaScript异步获取后端数据形成动态页面;如目前大量网站使用Element
‑
UI、MUSE
‑
UI、Vuetify等UI组件库,其中部分组件需要使用异步加载;如主流图表库Echarts等大多采用异步数据加载模式,并且使用动态样式。如果采用浏览器默认的打印功能或传统的打印方式无法获取异步加载的数据,而导致打印结果与浏览器所见内容不相符、样式错乱及部分空白等。
技术实现思路
[0003]有鉴于此,本专利技术实施例的目的是提供一种基于canvas的动态网页打印方法、系统及存储介质,能够解决动态网页由于异步加载方式导致的打印空白问题。
[0004]第一方面,本专利技术实施例提供了一种基于canvas的 ...
【技术保护点】
【技术特征摘要】
1.一种基于canvas的动态网页打印方法,其特征在于,包括步骤:获取打印指令,并根据所述打印指令克隆打印的目标文档对象模型以及递归取出所有所述目标文档对象模型的节点信息;根据所述节点信息确定canvas的渲染列队,并根据所述渲染列队将canvas渲染成图片;将所述图片替换所述目标文档对象模型,并执行打印操作。2.根据权利要求1所述的基于canvas的动态网页打印方法,其特征在于,所述递归取出所有所述目标文档对象模型的节点信息,包括以下步骤:递归取出所有所述目标文档对象模型的节点、节点内容、样式及属性信息;根据所述节点、节点内容、样式及属性信息确定渲染列表。3.根据权利要求2所述的基于canvas的动态网页打印方法,其特征在于,所述根据所述节点信息确定canvas的渲染列队,包括以下步骤:根据所述属性信息按照预设的规则对所述渲染列表排序确定所述渲染列队。4.根据权利要求3所述的基于canvas的动态网页打印方法,其特征在于,按照预设的规则对所述渲染列表排序确定所述渲染列队,包括以下步骤:按照包括从外层到内层、从浅层到深层及从上层到下层的顺序对所述渲染列表排序确定所述渲染列队。5.根据权利要求4所述的基于canvas的动态网页打印方法,其特征在于,根据所述渲染列队将canvas渲染成图片,包括以下步骤:遍历所述渲染列队,根据节点类型调用canvas API填充canvas;根据canvas API将所述canvas渲染成图片。6.根据权利要求5所述的基于canvas的动态网页打印方法,其特征在于,所述根据节点类型调用canvas AP...
【专利技术属性】
技术研发人员:石文军,范佳,马立珂,王子骏,
申请(专利权)人:广州鼎甲计算机科技有限公司,
类型:发明
国别省市:
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。