[发明专利]web应用数据埋点系统及埋点方法

说明书

本发明公开了一种web应用数据埋点系统，包括：埋点管理端，用于加载并运行埋点管理端Javascript脚本，从web应用服务器端获取埋点数据，并将埋点数据转换成可视化界面供管理人员进行操作；埋点管理端Javascript脚本，用于配置web应用服务器端地址，通过网络协议从web应用服务器端获取数据并渲染；埋点Javascript脚本，运行在web应用前端，用于从web应用服务器端获取埋点数据，并将埋点数据挂载到浏览器渲染的Dom节点中，且能侦听Dom元素的变化，并能Diff出待挂载的埋点数据重新挂载；本发明还公开了一种web应用数据埋点方法，本发明可视化埋点数据管理，并且无需在业务逻辑中注入埋点代码。

技术领域

本发明涉及web应用技术领域，特别是一种web应用数据埋点系统及埋点方法。

背景技术

目前在web应用的数据埋点收集领域，(不论是自研还是采用第三方库)实现的原理都较为统一。以采用第三方库实现举例，主要步骤包括注册第三方平台账号获取唯一的埋点key、引入第三方代码库、产品整理需要埋点的数据清单、研发人员再将需要埋点的地方逐一用代码添加进来，最后在第三方提供的管理平台上查看上报的数据。此种模式下由第三方承担了埋点代码库的维护以及数据上报和管理，基本实现了业务数据埋点的需求。但是在这种模式下，需要开发人员在业务应用中添加很多和实际业务毫无关联的埋点代码，且需要开发人员和产品密切配合才能完成整个埋点流程。整个过程中会产生很多和业务无关的冗余代码，以及沟通上的时间消耗，降低了应用研发的效率。

发明内容

为解决现有技术中存在的问题，本发明的目的是提供一种web应用数据埋点方法，本发明旨在以当前web应用环境下，能够快速、无耦合地实现对web应用的埋点需求；减少产品、研发等相关人员的工作量，降低沟通成本以及埋点代码与业务的耦合度，最终达到既能满足业务数据埋点的需求，又极大地降低了对项目的开发效率以及稳定性的影响。

为实现上述目的，本发明采用的技术方案是：一种web应用数据埋点系统，包括：

埋点管理端，用于加载并运行埋点管理端Javascript脚本，从web应用服务器端获取埋点数据，并将埋点数据转换成可视化界面供管理人员进行操作；

埋点管理端Javascript脚本，用于配置web应用服务器端地址，通过网络协议从所述web应用服务器端获取数据并渲染；

埋点Javascript脚本，运行在web应用前端，用于从所述web应用服务器端获取埋点数据，并将埋点数据挂载到浏览器渲染的Dom节点中，且能侦听Dom元素的变化，并能Diff出待挂载的埋点数据重新挂载。

作为一种优选的实施方式，所述的埋点数据为需要进行统计的用户行为和页面运行数据，具体包括按钮点击、页面跳转、数据过滤条件、页面占用内存、内存占用以及运行异常。

作为另一种优选的实施方式，埋点Javascript脚本中，将埋点数据挂载到浏览器渲染的Dom节点中具体包括：通过标准的Dom API将埋点数据与具体事件相结合。

作为另一种优选的实施方式，埋点Javascript脚本中，侦听Dom元素的变化具体包括：使用MutationObserver接口或其他相似接口监听页面上Dom树的变化。

作为另一种优选的实施方式，埋点Javascript脚本中，Diff出待挂载的埋点数据具体包括：通过收集Dom节点变更前后的节点列表进行比对，计算出需要重新挂载或者移除的埋点数据，避免埋点数据的重复挂载或者遗漏。

本发明还提供了一种web应用数据埋点方法，用于实现如上所述的web应用数据埋点系统，所述的埋点方法包括：