网页录屏方法、系统、设备及存储介质技术方案

本发明专利技术提供了一种网页录屏方法、系统、设备及存储介质，该方法包括：对网页的文档对象模型DOM树进行遍历，将所述DOM树中的节点映射成虚拟节点；采集影响所述网页的节点变化的动作数据；采集所述网页中的鼠标移动数据；将所述虚拟节点、所述动作数据和所述鼠标移动数据打包，得到录屏文件。本发明专利技术适用于对浏览器中的网页进行录屏，无需下载录屏软件，使用成本低，即使长时间录制也不会影响处理器性能，录制的文件体积小，可以便捷地将录制的文件进行传输，可以精确锁定录屏区域，仅对需要录屏的区域进行录制，可以很好地应用于监控系统、行为分析、案例复盘、远程教育等领域。远程教育等领域。远程教育等领域。

【技术实现步骤摘要】
网页录屏方法、系统、设备及存储介质


[0001]本专利技术涉及数据处理
，尤其涉及一种网页录屏方法、系统、设备及存储介质。

技术介绍

[0002]网页录屏是指对当前PC(个人电脑)端运行的浏览器中的操作流程进行录制，在监控系统、行为分析、案例复盘、远程教育等领域有大量应用场景。目前针对PC端的网页录屏主要的方式有：通过下载桌面端屏幕录像软件进行网页录屏或者苹果电脑用户使用系统自带的QuickTime Player软件进行网页录屏。
[0003]然而，现有的网页录屏方式主要存在如下一些问题：
[0004](1)必须下载桌面端录屏软件，且这些软件安装成本高，在Windows平台和苹果平台不一致，对于用户来说，学习成本高；
[0005](2)长时间录制会降低处理器性能；
[0006](3)录制的文件为视频格式，体积较大，传送给他人会非常不便捷，如果使用聊天工具进行文件传送，则视频文件会被聊天工具压缩，造成播放的时候清晰度下降；
[0007](4)录制的是整个屏幕的内容，很难指定区域，容易造成隐私泄漏，表述本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种网页录屏方法，其特征在于，包括如下步骤：对网页的文档对象模型DOM树进行遍历，将所述DOM树中的节点映射成虚拟节点；采集影响所述网页的节点变化的动作数据；采集所述网页中的鼠标移动数据；将所述虚拟节点、所述动作数据和所述鼠标移动数据打包，得到录屏文件。2.根据权利要求1所述的网页录屏方法，其特征在于，所述采集影响所述网页的节点变化的动作数据，包括基于变动观察器MutationObserver和addEventListener函数采集影响所述网页的节点变化的动作数据。3.根据权利要求1所述的网页录屏方法，其特征在于，采集影响所述网页的节点变化的动作数据，包括将影响所述网页的节点变化的动作数据存储于栈中，所述栈中的每个对象对应于一帧动作数据。4.根据权利要求1所述的网页录屏方法，其特征在于，采集所述网页中的鼠标移动数据，包括如下步骤：采集所述网页中鼠标的点击数据和停留数据。5.根据权利要求1所述的网页录屏方法，其特征在于，还包括通过HTML提供的webRTC接口进行音频录制，得到音频数据；将所述虚拟节点、所述动作数据和所述鼠标移动数据打包，包括将所述虚拟节点、所述动作数据、所述鼠标移动数据和所述音频数据打包。6.根据权利要求5所述的网页录屏方法，其特征在于，所述得到音频数据之后，还包括将所述音频数据转为MP3格式的数据。7.根据权利要求1所述的网页录屏方法，其特征在于，将所述虚拟节点、所述动作数据和所述鼠标移动数据打包，包括将所述虚拟节点、所述动作数据和所述鼠标移动数据基于Gzip进行压缩，得到压缩后的录屏文件...

【专利技术属性】
技术研发人员：黄笑，
申请(专利权)人：北京京东拓先科技有限公司，
类型：发明
国别省市：