[发明专利]网页录屏方法、系统、设备及存储介质

权利要求书

1.一种网页录屏方法，其特征在于，包括如下步骤：

对网页的文档对象模型DOM树进行遍历，将所述DOM树中的节点映射成虚拟节点；

采集影响所述网页的节点变化的动作数据；

采集所述网页中的鼠标移动数据；

将所述虚拟节点、所述动作数据和所述鼠标移动数据打包，得到录屏文件。

2.根据权利要求1所述的网页录屏方法，其特征在于，所述采集影响所述网页的节点变化的动作数据，包括基于变动观察器MutationObserver和addEventListener函数采集影响所述网页的节点变化的动作数据。

3.根据权利要求1所述的网页录屏方法，其特征在于，采集影响所述网页的节点变化的动作数据，包括将影响所述网页的节点变化的动作数据存储于栈中，所述栈中的每个对象对应于一帧动作数据。

4.根据权利要求1所述的网页录屏方法，其特征在于，采集所述网页中的鼠标移动数据，包括如下步骤：

采集所述网页中鼠标的点击数据和停留数据。

5.根据权利要求1所述的网页录屏方法，其特征在于，还包括通过HTML提供的webRTC接口进行音频录制，得到音频数据；

将所述虚拟节点、所述动作数据和所述鼠标移动数据打包，包括将所述虚拟节点、所述动作数据、所述鼠标移动数据和所述音频数据打包。

6.根据权利要求5所述的网页录屏方法，其特征在于，所述得到音频数据之后，还包括将所述音频数据转为MP3格式的数据。

7.根据权利要求1所述的网页录屏方法，其特征在于，将所述虚拟节点、所述动作数据和所述鼠标移动数据打包，包括将所述虚拟节点、所述动作数据和所述鼠标移动数据基于Gzip进行压缩，得到压缩后的录屏文件。

8.根据权利要求1所述的网页录屏方法，其特征在于，所述得到录屏文件之后，还包括如下步骤：

基于浏览器数据库indexedDB存储所述录屏文件；

通过WebSocket协议或HTTP协议将所述录屏文件持续上传到录屏服务器中。

9.根据权利要求1所述的网页录屏方法，其特征在于，还包括采集canvas插件中的绘图数据和/或采集ifame网页嵌套数据；

将所述虚拟节点、所述动作数据和所述鼠标移动数据打包，还包括将所述绘图数据和/或所述网页嵌套数据与所述虚拟节点、所述动作数据、所述鼠标移动数据一起打包。

10.一种网页录屏系统，用于实现权利要求1至9中任一项所述的网页录屏方法，其特征在于，所述系统包括：

节点映射模块，用于对网页的文档对象模型DOM树进行遍历，将所述DOM树中的节点映射成虚拟节点；

动作采集模块，用于采集影响所述网页的节点变化的动作数据；

鼠标采集模块，用于采集所述网页中的鼠标移动数据；

数据打包模块，用于将所述虚拟节点、所述动作数据和所述鼠标移动数据打包，得到录屏文件。

11.根据权利要求10所述的网页录屏系统，其特征在于，所述系统的代码通过RollUp打包器处理后，加载于浏览器中。

12.一种网页录屏设备，其特征在于，包括：

处理器；

存储器，其中存储有所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行权利要求1至9中任一项所述的网页录屏方法的步骤。

13.一种计算机可读存储介质，用于存储程序，其特征在于，所述程序被处理器执行时实现权利要求1至9中任一项所述的网页录屏方法的步骤。