基于JS-SDK的可视化埋点方法及系统技术方案

本发明专利技术公开了一种基于JS‑SDK的可视化埋点方法，包括：通过编辑器获得待埋点页面，并激活该页面的可视化埋点模式；编辑页面内的埋点，并将埋点信息通过编辑器传输给服务器；通过编辑器获取从服务器传输的与当前埋点相关的埋点列表，在非部署状态下将埋点列表内的信息绑定到当前页面；在编辑器切换为测试模式时，确认埋点元素以完成页面埋点的创建；访问当前页面，并从服务器获取当前页面内已创建的埋点；将已创建埋点信息绑定到当前页面，以在埋点触发后，将埋点触发信息在服务器保存。本发明专利技术解决了埋点操作复杂、上报数据量大的问题，可适用于复杂业务场景下的埋点方案，提高了数据分析结果的准确性。

【技术实现步骤摘要】
基于JS-SDK的可视化埋点方法及系统
本专利技术涉及数据采集处理
，尤其是涉及一种基于JS-SDK的可视化埋点方法及系统。
技术介绍
数据统计是互联网产品迭代过程中的重要部分，主要由数据采集、数据分析两部分组成，数据采集确定数据源，快速、准确、无遗漏地采集数据，是数据采集SDK(下文简称SDK)面临的主要挑战。SDK能够针对页面元素的点击信息来统计用于分析用户交互和用户行为，对互联网产品的持续优化起到很大作用。数据采集流程大致为设计埋点、集成SDK、触发埋点、上报服务器。其中，现有的数据采集方式主要有代码采集、全埋点采集、可视化采集等。具体地，代码采集大致流程为运营人员提出数据统计需求，产品人员设计埋点，开发人员调用SDK采集接口植入埋点，重新打包发布新版本，数据上报后运营人员进行分析。这种埋点方式采集精准且数据量小，缺点是人力和时间成本高。全埋点采集预先将埋点植入到所有页面元素，所有元素被点击后都会上报数据，运营人员筛选出关心的元素后进行数据统计，这种采集方式避免了重新发版的麻烦，缺点是数据量大，且上报数据形式单一不灵活。可视化采集可以在不发版的情况下新增采集点，且采集精准、上报数据量小，一定程度上综合了代码埋点和全埋点的优点，是数据采集发展的重要方向。进一步，现有SDK的可视化采集技术主要有基于全埋点的可视化、基于编辑器圈选的可视化。其中，基于全埋点的可视化采集了所有元素的点击事件，在分析数据时在编辑器中圈选所关心的数据进行分析，其技术核心还是全埋点采集。这种技术虽然能够对埋点进行可视化圈选，但本质上还是全埋点技术，仍然具有数据量大、且上报的数据只包括元素点击信息，而无法上报元素相关信息。基于设备端圈选的可视化在编辑埋点时使用设备上运行的SDK宿主程序，生成埋点指令部署后全网生效。但这种技术的可视化在手机终端设备上操作埋点，操作难度大，受限于屏幕尺寸和交互方式不能实现复杂的埋点需求。另外，基于编辑器圈选的可视化采集技术，是使用单独的网页编辑器编辑埋点，部署后全网生效。但现有的基于编辑器圈选的可视化采集技术仍然处于发展初期，现有解决方案只采集元素点击事件，对于复杂的采集环境下的采集需求尚不能满足。
技术实现思路
为了解决上述技术问题，本专利技术提供了一种基于JS-SDK的可视化埋点方法，包括：通过编辑器获得待埋点页面，并激活该页面的可视化埋点模式；编辑页面内的埋点，并将埋点信息通过所述编辑器传输给服务器；通过所述编辑器获取从所述服务器传输的与当前埋点相关的埋点列表，在非部署状态下将所述埋点列表内的信息绑定到当前页面；在所述编辑器切换为测试模式时，确认埋点元素以完成页面埋点的创建；访问当前页面，并从所述服务器获取所述当前页面内已创建的埋点；将已创建埋点信息绑定到当前页面，以在所述埋点触发后，将埋点触发信息在所述服务器保存。优选地，在编辑页面内的埋点步骤中，通过圈选页面元素的方式进行编辑。优选地，所述埋点信息包括但不限于：埋点元素的标识、埋点元素在页面结构内的位置、埋点元素的关联属性信息、埋点元素的定位方式、埋点生效范围、页面生效范围以及生效版本，其中，所述埋点元素的定位方式选自new_path定位、按属性定位和同级元素定位中的一种或几种的组合。优选地，在将已创建埋点信息绑定到当前页面步骤中，包括：解析当前页面所涉及的已创建埋点信息，按照已定义的元素定位方式，对目标埋点元素进行定位，并获取所述目标埋点元素的关联属性，其中，在已定义元素定位方式为多种时，若每种定位处理后得到的埋点元素定位结果均相同，则当前页面的元素定位操作成功，从而将该埋点元素定位结果作为所述目标埋点元素；否则，失败。优选地，在将已创建埋点信息绑定到当前页面步骤之后，还包括：在目标埋点元素定位成功后，为所述目标埋点元素添加事件监听器。优选地，所述方法还包括：通过编辑器与所述服务器连接，在终端SDK与所述服务器连接时获取页面信息获取通知，其中，所述页面信息获取通知是在所述终端SDK将所述待埋点页面的页面信息发送至所述服务器后由所述服务器发出；通过所述服务器，将所述待埋点页面的页面信息反馈至所述终端SDK，以由所述终端SDK将所述页面信息放入终端网页视窗元素的h5视窗属性内，从而将新的页面信息传输至所述服务器。优选地，在埋点绑定过程中，还包括：接收含有Hybrid埋点的埋点信息，并进行页面绑定，其中，由所述编辑器识别所述埋点信息，在含有Hybrid埋点或该埋点仅以按属性定位方式进行绑定时，在所述埋点信息中标记出当前埋点为Hybrid埋点，并将更新后埋点信息通过服务器发送至所述终端SDK，以在所述终端SDK将所述Hybrid埋点筛选出来后通过所述服务器发送至网页端数据采集器。优选地，如果当前埋点为Hybrid埋点，那么将通过所述服务器调用所述终端SDK中存储的关于当前埋点的关联元素属性；如果当前埋点为非Hybrid埋点，那么在获得第一通知后，将含有当前埋点的关联元素属性信息的所述埋点信息通过所述服务器反馈至所述终端SDK，其中，在所述终端SDK检测到当前埋点触发时，通过所述服务器向所述网页端数据采集器发送所述第一通知。优选地，在接收并绑定Hybrid埋点步骤之后，还包括：在当前Hybrid埋点被触发后，通过所述终端SDK将相应的埋点触发信息传输至所述服务器。另一方面，本专利技术还提供了一种基于JS-SDK的可视化埋点系统，所述可视化埋点系统执行如上述所述的方法，所述可视化埋点系统包括：网页端数据采集器，其用于先通过编辑器获得待埋点页面，并激活该页面的可视化埋点模式，而后编辑页面内的埋点，并将埋点信息通过所述编辑器传输给服务器，然后，通过所述编辑器获取从所述服务器传输的与当前埋点相关的埋点列表，在非部署状态下将所述埋点列表内的信息绑定到当前页面，在所述编辑器切换为测试模式时，确认埋点元素以完成页面埋点的创建，以及访问当前页面，并从所述服务器获取所述当前页面内已创建的埋点，最后将已创建埋点信息绑定到当前页面，以在所述埋点触发后，将埋点触发信息在所述服务器保存；编辑器，其与所述网页端数据采集器和服务器通过PostMessage进行通信；和所述服务器，其与所述网页端数据采集器通过Http或Https方式进行通信，用于存储并传输网站页面的页面信息、各页面内的已创建埋点信息和各页面内的已创建埋点的埋点触发信息。与现有技术相比，上述方案中的一个或多个实施例可以具有如下优点或有益效果：本专利技术提出了一种基于JS-SDK的可视化埋点方法及系统。该方法及系统，首先使用网页端可视化编辑器圈选方式埋点，解决埋点操作复杂，上报数据量大的问题；使用属性定位的方式定位页面元素，从而解决了不同版本页面元素位置不一致导致的定位失败的问题、以及使用同级埋点技术解决列表类元素埋点问题，继而能够解决复杂业务场景下的埋点方案。另外，本专利技术能够在埋点信息内嵌入与埋点元素相关的关联属性信息，能够在埋点处采集更加丰富的数据，进一步，为数据分析阶段提供了更多类型的数据资料，同时能够从多维角度对埋点采集数据进行分析，提高了数据分析结果本文档来自技高网...

【技术保护点】
1.一种基于JS-SDK的可视化埋点方法，包括：/n通过编辑器获得待埋点页面，并激活该页面的可视化埋点模式；/n编辑页面内的埋点，并将埋点信息通过所述编辑器传输给服务器；/n通过所述编辑器获取从所述服务器传输的与当前埋点相关的埋点列表，在非部署状态下将所述埋点列表内的信息绑定到当前页面；/n在所述编辑器切换为测试模式时，确认埋点元素以完成页面埋点的创建；/n访问当前页面，并从所述服务器获取所述当前页面内已创建的埋点；/n将已创建埋点信息绑定到当前页面，以在所述埋点触发后，将埋点触发信息在所述服务器保存。/n

【技术特征摘要】
1.一种基于JS-SDK的可视化埋点方法，包括：
通过编辑器获得待埋点页面，并激活该页面的可视化埋点模式；
编辑页面内的埋点，并将埋点信息通过所述编辑器传输给服务器；
通过所述编辑器获取从所述服务器传输的与当前埋点相关的埋点列表，在非部署状态下将所述埋点列表内的信息绑定到当前页面；
在所述编辑器切换为测试模式时，确认埋点元素以完成页面埋点的创建；
访问当前页面，并从所述服务器获取所述当前页面内已创建的埋点；
将已创建埋点信息绑定到当前页面，以在所述埋点触发后，将埋点触发信息在所述服务器保存。


2.根据权利要求1所述的可视化埋点方法，其特征在于，在编辑页面内的埋点步骤中，通过圈选页面元素的方式进行编辑。


3.根据权利要求1或2所的可视化埋点方法，其特征在于，所述埋点信息包括但不限于：埋点元素的标识、埋点元素在页面结构内的位置、埋点元素的关联属性信息、埋点元素的定位方式、埋点生效范围、页面生效范围以及生效版本，其中，所述埋点元素的定位方式选自new_path定位、按属性定位和同级元素定位中的一种或几种的组合。


4.根据权利要求3所述的可视化埋点方法，其特征在于，在将已创建埋点信息绑定到当前页面步骤中，包括：
解析当前页面所涉及的已创建埋点信息，按照已定义的元素定位方式，对目标埋点元素进行定位，并获取所述目标埋点元素的关联属性，其中，
在已定义元素定位方式为多种时，若每种定位处理后得到的埋点元素定位结果均相同，则当前页面的元素定位操作成功，从而将该埋点元素定位结果作为所述目标埋点元素；否则，失败。


5.根据权利要求1～4中任一项所述的可视化埋点方法，其特征在于，在将已创建埋点信息绑定到当前页面步骤之后，还包括：
在目标埋点元素定位成功后，为所述目标埋点元素添加事件监听器。


6.根据权利要求1～5中任一项所述的可视化埋点方法，其特征在于，所述方法还包括：
通过编辑器与所述服务器连接，在终端SDK与所述服务器连接时获取页面信息获取通知，其中，所述页面信息获取通知是在所述终端SDK将所述待埋点页面的页面信息发送至所述服务器后由所述服务器发出；
通过所述服务器，将所述待埋点页面的页面信息反馈至所述终端SDK，以由所述终端SDK将所述页面信息放入终端网页视窗元素的h5视...

【专利技术属性】
技术研发人员：于扬，
申请(专利权)人：北京易观智库网络科技有限公司，
类型：发明
国别省市：北京;11