CN116107587A - 一种应用于页面中的埋点方法、装置、设备及介质 - Google Patents

Abstract

本发明实施例公开了一种应用于页面中的埋点方法、装置、设备及介质，该方法包括：接收页面渲染指令；根据页面渲染指令遍历待渲染页面中每个待渲染元素，并在待渲染元素中包括埋点指令时，调取目标数据模型；其中，目标数据模型中包括各编译环境下所对应的埋点值；根据待渲染元素所属的目标编译环境，埋点指令所携带的埋点字段以及目标数据模型，确定待渲染元素的目标埋点值；基于目标埋点值和相应的目标编译环境为待渲染元素添加埋点属性。本发明实施例的技术方案，解决了半自动埋点方式需要人工设置不同编译环境所对应的埋点值，导致工作量较大、工作效率低的技术问题，实现了埋点方案的优化，从而提高了埋点的工作效率。

Description

一种应用于页面中的埋点方法、装置、设备及介质

技术领域

本发明实施例涉及信息处理技术领域，尤其涉及一种应用于页面中的埋点方法、装置、设备及介质。

背景技术

为了获取用户在页面、应用程序等上的触发操作，需要进行页面埋点，以上报埋点处的行为数据。常用的埋点方法是半自动埋点方式。所谓半自动，就是需要提前定义需要上报埋点的位置，前端研发人员预先给相关位置设置埋点值，然后通过上报埋点数据，查看预设埋点的流量情况。

发明人在基于上述方式实施本技术方案时，发现存在如下问题：

对不同编译环境下的页面元素进行埋点处理时，需要多次遍历每个页面元素，并为每个页面元素添加埋点属性，以在用户触发页面元素时可以查看埋点数据，存在工作量大的问题。同时，如果增加新编译环境的页面元素时，需要重新遍历所有元素，进而添加新增的埋点值，这个过程需要耗费大量的时间和计算机资源，从而导致埋点工作的效率大打折扣。

发明内容

本发明提供一种应用于页面中的埋点方法、装置、设备及介质，以对埋点方案进行优化，从而提高了埋点的工作效率。

第一方面，本发明实施例提供了一种应用于页面中的埋点方法，该方法包括：

接收页面渲染指令；

根据所述页面渲染指令遍历待渲染页面中每个待渲染元素，并在所述待渲染元素中包括埋点指令时，调取目标数据模型；其中，所述目标数据模型中包括各编译环境下所对应的埋点值；

根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值；

基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性。

进一步的，所述方法还包括：

获取预先设置的待埋点元素列表；

基于所述待埋点元素列表为相应待渲染元素添加埋点指令；其中，所述埋点指令中包括埋点字段，以基于所述埋点字段从所述目标数据模型中获取相应的目标埋点值。

进一步的，所述方法还包括：

确定各编译环境下所对应的埋点值；

根据所述编译环境以及相应的埋点值，确定所述目标数据模型。

进一步的，所述方法还包括：

确定所述待渲染元素所对应的目标编译环境；

根据所述埋点指令中所对应的埋点字段，从所述目标数据模型中确定至少一个待选择埋点值；

根据所述目标编译环境从所述至少一个待选择埋点值中，确定出所述目标埋点值。

进一步的，所述方法还包括：

将所述目标编译环境所对应的编译标识以及所述目标埋点值，添加至所述待渲染元素所对应的埋点属性中。

进一步的，所述方法还包括：

当接收到新增编译环境的新增指令时，确定所述新增编译环境所对应的待渲染元素和相应的埋点值；

基于所述待渲染元素和相应的埋点值更新所述目标数据模型，以在接收到页面渲染指令时，基于更新后的目标数据模型确定相应编译环境下待渲染元素的目标埋点值。

进一步的，所述方法还包括：

在遍历完成所述待渲染页面中的各待渲染元素之后，得到与所述待渲染页面所对应的目标渲染页面；

其中，所述目标渲染页面中包括至少一个页面元素，所述至少一个页面元素中包括已为相应待渲染元素添加埋点属性的元素。

进一步的，所述方法还包括：

当检测到触发所述目标渲染页面中的页面元素，且所述页面元素中包括埋点属性时，上报与所述页面元素相对应的埋点数据。

进一步的，所述方法还包括：

当检测到触发所述目标渲染页面中已为待渲染元素添加埋点属性的页面元素，且所述页面元素中未包括与所述目标编译环境相对应的编译标识时，调取目标函数，以基于所述目标函数获取与所述页面元素相对应的虚拟元素上的编译标识赋值至所述页面元素；以及，

上报与所述页面元素相对应的埋点数据。

第二方面，本发明实施例还提供了一种应用于页面中的埋点装置，该装置包括：

渲染指令接收模块，用于接收页面渲染指令；

数据模型调取模块，用于根据所述页面渲染指令遍历待渲染页面中每个待渲染元素，并在所述待渲染元素中包括埋点指令时，调取目标数据模型；其中，所述目标数据模型中包括各编译环境下所对应的埋点值；

目标埋点值确定模块，用于根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值；

埋点属性添加模块，用于基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性。

第三方面，本发明实施例还提供了一种电子设备，电子设备包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当一个或多个程序被一个或多个处理器执行，使得一个或多个处理器实现如本发明实施例任一的应用于页面中的埋点方法。

第四方面，本发明实施例还提供了一种包含计算机可执行指令的存储介质，计算机可执行指令在由计算机处理器执行时用于执行如本发明实施例任一的应用于页面中的埋点方法。

本发明实施例的技术方案，首先接收页面渲染指令，进而根据页面渲染指令遍历待渲染页面中每个待渲染元素，并在待渲染元素中包括埋点指令时，调取目标数据模型，进一步的，根据待渲染元素所属的目标编译环境，埋点指令所携带的埋点字段以及目标数据模型，确定待渲染元素的目标埋点值，最后，基于目标埋点值和相应的目标编译环境为待渲染元素添加埋点属性。本发明实施例的技术方案，解决了半自动埋点方式需要人工设置不同端所对应的埋点值，导致工作量较大、工作效率低的技术问题，通过目标数据模型定义不同编译环境对应的埋点值，在对待渲染元素进行埋点时，可以直接调用目标数据模型读取与待渲染元素相对应的目标埋点值，基于目标埋点值为待渲染元素添加埋点属性，便可以实现待渲染元素的埋点处理，同时，在后续增加新的编译环境页面元素时，只需要在目标数据模型中定义新的编译环境以及埋点值即可，无需遍历再添加新增的埋点值，这样一来可以节约埋点处理时长和计算机资源，实现了埋点方案的优化，从而提高了埋点的工作效率。

附图说明

为了更加清楚地说明本发明示例性实施例的技术方案，下面对描述实施例中所需要用到的附图做一简单介绍。显然，所介绍的附图只是本发明所要描述的一部分实施例的附图，而不是全部的附图，对于本领域普通技术人员，在不付出创造性劳动的前提下，还可以根据这些附图得到其他的附图。

图1为本发明实施例所提供的一种应用于页面中的埋点方法的流程示意图；

图2为本发明实施例所提供的一种应用于页面中的埋点方法的流程示意图；

图3为本发明实施例所提供的一种应用于页面中的埋点方法的流程示意图；

图4为本发明实施例所提供的一种应用于页面中的埋点方法的流程示意图；

图5为本发明实施例所提供的为待渲染元素添加埋点指令的流程示意图；

图6为本发明实施例所提供的一种应用于页面中的埋点方法的流程示意图；

图7为本发明实施例所提供的用户在操作阶段埋点数据上报的流程示意图；

图8为本发明实施例所提供的一种应用于页面中的埋点装置的结构示意图；

图9为本发明实施例所提供的一种电子设备的结构示意图。

具体实施方式

下面结合附图和实施例对本发明作进一步的详细说明。可以理解的是，此处所描述的具体实施例仅仅用于解释本发明，而非对本发明的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本发明相关的部分而非全部结构。

在介绍本技术方案之前，可以先对应用场景进行说明。可以将本发明实施例所提供技术方案应用在对任意页面、应用程序等需要进行埋点的场景中。在进行页面元素渲染时，基于同样的埋点方式，可以适用于不同端的埋点操作，其中，可以将H5、各种小程序等称之为“端”。在埋点完成后，用户可以触发页面中的某些元素，以观看用户感兴趣的内容，若用户触发的页面元素预先设置了埋点，则可以上报用户对该元素的行为数据，进而实现对埋点数据的分析。

图1为本发明实施例所提供的一种应用于页面中的埋点方法的流程示意图，本实施例可适用于在基于目标数据模型进行待渲染元素进行埋点的情形，该方法可以由应用于页面中的埋点装置来执行，该装置可以通过软件和/或硬件的形式实现，该硬件可以是电子设备，如移动终端、PC端或服务器等。

如图1所示，所述方法包括：

S110、接收页面渲染指令。

其中，页面渲染是服务器将请求返回的页面资源(HTML文本，图像，动画，视频，音频等)基于一定的规则完成页面布局及绘制的过程。页面渲染指令为需要进行页面渲染时发出的指令。可选的，用户可以触发页面上设置的控件，生成页面渲染指令。示例性的，用户在应用设备上触发某一个应用程序对应的控件，以展示应用程序对应的页面，用户的触发操作可以作为页面渲染指令。

具体地，可以预先设置至少一个用于获取页面渲染指令触发操作的控件，当服务器检测到用户的触发操作时，则可以获取页面渲染指令，以便可以根据页面渲染指令执行后续操作。

示例性地，用户可以触发页面或者移动终端设备上开启某一应用程序的控件，以展示页面或者某一应用程序对应的显示画面，此时用户的触发操作为页面渲染指令。进一步的，服务器可以接收该页面渲染指令。

S120、根据页面渲染指令遍历待渲染页面中每个待渲染元素，并在待渲染元素中包括埋点指令时，调取目标数据模型。

其中，待渲染页面为将要进行页面渲染的页面。待渲染元素为需要渲染至待渲染页面中的各个元素，其中，元素可以表示为DOM元素。

在实际应用中，可以预先设置哪些元素是需要预先埋点的，可以对这些需要预先埋点的元素作相应的标记，这些标记内容可以理解为埋点指令。还需要说明的是，对于待渲染页面中的各待渲染元素而言，有部分待渲染元素的触发操作是具有实际意义的，可以对触发操作进行响应；有部分待渲染元素的触发操作并无实际意义，仅是展示对应的待渲染元素，对于用户的触发操作不会产生响应。相应的，待渲染页面中的待渲染元素的数量可以是一个或者多个，甚至可以没有。

其中，目标数据模型为开发人员构建的数据模型，目标数据模型中包括多个不同的编译环境、每个编译环境对应的埋点字段以及埋点字段对应的埋点值。在本实施例中，设置数据模型的好处是：可以基于数据模型中设置的埋点值进行不同编译环境下的页面渲染。

具体的，服务器接收到页面渲染指令之后，需要对待渲染页面中包含的每一个待渲染元素进行渲染，对于每个待渲染元素的渲染，所采用的方式都是相同的，基于此，可以以其中一个待渲染元素为例进行示例性说明。若此元素为预先设定的包含埋点指令的待渲染元素，则调取目标数据模型。

示例性的，待渲染页面中可以包括5个待渲染元素，其中有2个待渲染元素包括埋点指令。服务器在接收到页面渲染指令时，首先对第一个待渲染元素进行处理，再对第二个待渲染元素进行处理，若在对第三个待渲染元素进行处理时，检测到第三个待渲染元素存在埋点指令，此时调取目标数据模型，以基于目标数据模型进行埋点属性的添加，相应的，若检测到第四个待渲染元素同样存在埋点指令，此时也调取目标数据模型，重复执行添加埋点属性的操作，直至处理完第五个待渲染元素。

S130、根据待渲染元素所属的目标编译环境，埋点指令所携带的埋点字段以及目标数据模型，确定待渲染元素的目标埋点值。

在实际应用中，对待渲染元素而言，用户的触发操作可以是基于小程序端进行响应的，也可以是基于H5端进行响应的，不同端对应的编译环境是不同的，且不同端对应的编译环境是可以确定的。。目标编译环境为可以理解为待渲染元素为基于哪一端进行响应的，将这一端对应的编译环境作为目标编译环境。例如，待渲染页面中可以包括2个待渲染元素，待渲染元素1是基于小程序进行响应的，则待渲染元素1的目标编译环境为小程序对应的编译环境；待渲染元素2是基于H5进行响应的，则待渲染元素2的目标编译环境为H5对应的编译环境。

其中，埋点字段为埋点指令中携带的字段，埋点字段是目标数据模型中定义的字段。目标埋点值为预先在目标数据模型中编译好的数值。待渲染元素所属的编译环境不同，其目标埋点值是不同的。

具体的，目标数据模型中包括多个不同的编译环境、每个编译环境对应的埋点字段以及埋点字段对应的埋点值。在目标数据模型中，在确定待渲染元素的目标编译环境以及埋点字段的情况下，可以确定待渲染元素的目标埋点值。

示例性的，目标数据模型的数据模型结构可以为：

{“H5”:{“inviter”:“2T16|59247”},

“app”:{“inviter”:“2T79|59509”},…}

对于待渲染元素1而言，待渲染元素1的目标编译环境为是H5对应的编译环境，埋点指令所携带的埋点字段为“inviter”，在读取目标数据模型中的数据时，可以定位到第一行，则待渲染元素1的目标埋点值为“2T16|59247”。

S140、基于目标埋点值和相应的目标编译环境为待渲染元素添加埋点属性。

其中，埋点属性为待渲染元素埋点的属性特征。在应用中，每一个待渲染元素都预先设定一个属性编辑存储模块，这个模块可以用于存储待渲染元素的埋点属性，在后续应用时可以直接读取属性编辑存储模块中的埋点属性。

具体的，在获取到待渲染元素的目标埋点值以及相应的目标编译环境时，将目标编译环境对应的属性以及目标埋点值添加到待渲染元素的属性编辑存储模块中，作为待渲染元素埋点属性的一部分。

示例性的，在获取到待渲染元素的目标埋点值以后，可以将目标埋点值以及目标编译环境对应的属性添加到待渲染元素对应的DOM上，参见图2。如图2所示，在接收到页面渲染指令后，如果待渲染元素包括埋点指令，则读取目标数据模型，进一步的，判断待渲染元素所属的目标编译环境，如果目标编译环境对应的是H5，目标埋点值为2T16|59247，在DOM上添加clstag属性；如果编译环境对应的是小程序，目标埋点值为值为2T79|59509，则DOM上添加data-cls属性。

本发明实施例的技术方案，首先接收页面渲染指令，进而根据页面渲染指令遍历待渲染页面中每个待渲染元素，并在待渲染元素中包括埋点指令时，调取目标数据模型，进一步的，根据待渲染元素所属的目标编译环境，埋点指令所携带的埋点字段以及目标数据模型，确定待渲染元素的目标埋点值，最后，基于目标埋点值和相应的目标编译环境为待渲染元素添加埋点属性。本发明实施例的技术方案，解决了半自动埋点方式需要人工设置不同端所对应的埋点值，导致工作量较大、工作效率低的技术问题，通过目标数据模型定义不同编译环境对应的埋点值，在对待渲染元素进行埋点时，可以直接调用目标数据模型读取与待渲染元素相对应的目标埋点值，基于目标埋点值为待渲染元素添加埋点属性，便可以实现待渲染元素的埋点处理，同时，在后续增加新的编译环境页面元素时，只需要在目标数据模型中定义新的编译环境以及埋点值即可，无需遍历再添加新增的埋点值，这样一来可以节约埋点处理时长和计算机资源，实现了埋点方案的优化，从而提高了埋点的工作效率。

图3为本发明实施例所提供的一种应用于页面中的埋点方法示意图，在前述实施例的基础上，本发明实施例在上述实施例的基础上对前述实施例S130和S140步骤对应的内容进行进一步细化，其具体的实施方式可以参见本实施例技术方案。其中，与上述实施例相同或者相应的技术术语在此不再赘述。

如图3所示，该方法具体包括如下步骤：

S210、接收页面渲染指令。

S220、根据页面渲染指令遍历待渲染页面中每个待渲染元素，并在待渲染元素中包括埋点指令时，调取目标数据模型。

S230、确定待渲染元素所对应的目标编译环境。

在本实施例中，待渲染元素的目标编译环境可以基于编译环境解码工具进行识别。由于待渲染元素在计算机中是以代码的形式存储的，因此可以将待渲染元素对应的程序代码输入至编译环境解码工具中，编译环境解码工具可以识别待渲染元素对应的目标编译环境。

S240、根据埋点指令中所对应的埋点字段，从目标数据模型中确定至少一个待选择埋点值。

其中，待选择埋点值为在目标数据模型中与各埋点字段所对应的埋点值。具有相同埋点字段的埋点值。

具体的，在目标数据模型中，同一埋点字段对应的埋点值可以包括一个或者多个，不同的埋点值与不同的编译环境是相对应的。

示例性的，待渲染元素埋点指令中携带的埋点字段为“inviter”，目标数据模型中，埋点字段“inviter”对应的待选择埋点值包括2个，分别是“2T16|59247”、“2T79|59509”，则将这两个埋点值作为待选择埋点值。其中，待选择埋点值“2T16|59247”与H5的编译环境是对应的，待选择埋点值“2T79|59509”与小程序的编译环境是对应的。

S250、根据目标编译环境从至少一个待选择埋点值中，确定出目标埋点值。

在本实施例中，基于上述可知，基于埋点字段可以确定多个待选择埋点值。在目标数据模型中，待选择埋点值对应的编译环境是不同的，可以基于待渲染元素的目标编译环境可以确定出目标埋点值。这样设置的好处在于：首先根据埋点指令中所对应的埋点字段确定多个待选择埋点值，进而基于目标编译环境从多个待选择埋点值中确定目标埋点值，可以有序精确的找到待渲染元素的目标埋点值。

S260、将目标编译环境所对应的编译标识以及目标埋点值，添加至待渲染元素所对应的埋点属性中。

在本实施例中，各不同的编译环境可以对应不同的编译标识。例如，如果目标编译环境对应的是H5，则对应的编译标识可以是clstag；如果编译环境对应的是小程序，则对应的编译标识可以是data-cls。

具体的，在获取到待渲染元素的目标埋点值以及相应的目标编译环境时，可以确定目标编译环境所对应的编译标识，进而将目标编译环境所对应的编译标识以及目标埋点值添加到待渲染元素的属性编辑的存储模块中，作为待渲染元素埋点属性的一部分。这样设置的好处在于：待渲染元素的埋点属性中包括目标编译环境所对应的编译标识以及目标埋点值，基于目标编译环境所对应的编译标识以及目标埋点值，可以快速查询到待渲染元素的埋点数据，以高效便捷的实现埋点数据上报。

本发明实施例的技术方案，首先接收页面渲染指令，进而根据页面渲染指令遍历待渲染页面中每个待渲染元素，并在待渲染元素中包括埋点指令时，调取目标数据模型，进一步的，确定待渲染元素所对应的目标编译环境，根据埋点指令中所对应的埋点字段，从目标数据模型中确定至少一个待选择埋点值，从而，根据目标编译环境从至少一个待选择埋点值中，确定出目标埋点值，最后，将目标编译环境所对应的编译标识以及目标埋点值，添加至待渲染元素所对应的埋点属性中。本发明实施例的技术方案，实现了可以有序精确的找到待渲染元素的目标埋点值，并基于目标编译环境所对应的编译标识以及目标埋点值，快速查询到待渲染元素的埋点数据，以高效便捷的实现埋点数据上报，提高了预设埋点的工作效率。

图4本发明实施例所提供的一种应用于页面中的埋点方法的流程示意图，在前述实施例的基础上，目标数据模型可以是自定义确定的，其具体的实施方式可以参见本实施例技术方案。其中，与上述实施例相同或者相应的技术术语在此不再赘述。

如图4所示，该方法包括：

S310、获取预先设置的待埋点元素列表。

其中，待埋点元素列表是预先设定好的列表，待埋点元素列表中记录了需要对待渲染页面中的哪些待渲染元素进行埋点。

在本实施例中，为了确定需要对哪些待渲染元素添加埋点指令，可以预先设置待埋点元素列表。待埋点元素列表包含多个需要进行埋点的待渲染元素以及各待渲染元素对应的位置信息，可以将待埋点元素列表存储在服务器端，在需要对待渲染元素添加埋点指令时，直接调取待埋点元素列表，以基于待埋点元素列表中记录的待渲染元素，为其添加埋点指令。

S320、基于待埋点元素列表为相应待渲染元素添加埋点指令。

其中，埋点指令为用于调取目标数据模型的指令信息，埋点指令中包括埋点字段，以基于埋点字段从目标数据模型中获取相应的目标埋点值。

在本实施例中，待埋点元素列表中记录了需要进行埋点的待渲染元素，将读取到这些需要进行埋点的待渲染元素后，对其添加埋点指令。这样设置的好处在于：预先确定待渲染页面中的哪些待渲染元素需要进行埋点，在为待渲染元素添加埋点指令时，直接调取待埋点元素列表，无需逐一查询，提高了埋点效率。

示例性的，为待渲染元素添加埋点指令具体的流程，参见图5。如图5所示，在研发阶段，预先创建待埋点元素列表，查询待埋点元素列表中记录的元素，找到需要埋点的待渲染元素对应的DOM，进而在DOM上添加v-cls指令，其中，v-cls指令即为埋点指令。

S330、确定各编译环境下所对应的埋点值。

在本实施例中，各编译环境下对应的埋点值是可以预先定义的，同时，各待渲染元素在不同编译环境下的埋点值是存在差异的，这是为了区分不同的编译环境。可选的，可以预先构建的各编译环境与其对应的埋点值之间的映射关系表，进而，在构建目标数据模型时，通过查询映射关系表，确定各编译环境下对应的埋点值。

S340、根据编译环境以及相应的埋点值，确定目标数据模型。

在本实施例中，目标数据模型是可以自定义构建的，可以根据编译环境以及编译环境对应的埋点值构建目标数据模型。这样设置的好处在于：目标数据模型是研发人员自定义构建的，研发人员只需要根据不同的编译环境，设置对应的埋点值，提高埋点效率。

可选的，目标数据模型可以是JSON数据模型，数据模型结构可以为：

{“H5”:{“inviter”:“2T16|59247”},

“app”:{“inviter”:“2T79|59509”},…}

在这个数据结构中，包括了H5和小程序两个编译环境，“inviter”为各编译环境对应的埋点字段，“2T16|59247”为H5埋点字段对应的埋点值，“2T79|59509”为小程序埋点字段对应的埋点值。

可选的，当接收到新增编译环境的新增指令时，确定所述新增编译环境所对应的待渲染元素和相应的埋点值；基于所述待渲染元素和相应的埋点值更新所述目标数据模型，以在接收到页面渲染指令时，基于更新后的目标数据模型确定相应编译环境下待渲染元素的目标埋点值。

其中，新增编译环境为目标数据模型中原本并没有记录的其他编译环境。

在本实施例中，如果接收到目标数据模型中原本没有记录的新增编译环境的新增指令时，可以自动将新增编译环境对应的待渲染元素以及对应的埋点值更新到目标数据模型中，以实现目标数据模型实时更新的有益效果。

示例性的，如果原本的目标数据模型的数据模型结构为：

{“H5”:{“inviter”:“2T16|59247”},

“app”:{“inviter”:“2T79|59509”},…}

如果新增编译环境为A小程序，则只需要在目标数据模型的数据模型结构增加Aapp:{inviter:“t1|t2”}相关数据就完成了新增编译环境的埋点工作。

在本实施例中，在后续以使在接收到页面渲染指令时，基于最新的目标数据模型，确定相应编译环境下待渲染元素的目标埋点值，这样设置的好处在于：在如果添加了一个新的编译环境，只需要在目标数据模型中填写上新增编译环境的埋点数据值，这种方式实现简单，提高了预设埋点的工作效率。

S350、接收页面渲染指令。

S360、根据所述页面渲染指令遍历待渲染页面中每个待渲染元素，并在所述待渲染元素中包括埋点指令时，调取目标数据模型。

S370、根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值。

S380、基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性。

本发明实施例的技术方案，通过获取预先设置的待埋点元素列表，基于待埋点元素列表为相应待渲染元素添加埋点指令。目标数据模型是可以自定义确定的，在定义目标数据模型时，首先确定各编译环境下所对应的埋点值，进而根据编译环境以及相应的埋点值，确定目标数据模型。在接收到页面渲染指令时，根据所述页面渲染指令遍历待渲染页面中每个待渲染元素，并在所述待渲染元素中包括埋点指令时，调取目标数据模型。进一步的，根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值，最后，基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性。本发明实施例的技术方案，目标数据模型是研发人员自定义构建的，研发人员根据不同的编译环境，设置对应的埋点值，在如果添加了一个新的编译环境，只需要在目标数据模型中填写上新增编译环境的埋点数据值，这种方式实现简单，提高了预设埋点的工作效率。

图6本发明实施例所提供的一种应用于页面中的埋点方法的流程示意图，在前述实施例的基础上，在为待渲染元素添加埋点属性之后，得到待渲染页面对应的目标渲染页面，并基于目标渲染页面上的触发操作，上报埋点数据，其具体的实施方式可以参见本实施例技术方案。其中，与上述实施例相同或者相应的技术术语在此不再赘述。

如图6所示，该方法包括：

S410、接收页面渲染指令。

S420、根据页面渲染指令遍历待渲染页面中每个待渲染元素，并在待渲染元素中包括埋点指令时，调取目标数据模型。

S430、根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值。

S440、基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性。

S450、得到与待渲染页面所对应的目标渲染页面。

其中，目标渲染页面为待渲染页面完成绘制并展示在显示界面中的画面内容。目标渲染页面中包括至少一个页面元素，至少一个页面元素中包括已为相应待渲染元素添加埋点属性的元素。

在本实施例中，为了展示待渲染页面最终的展示画面，使用户可以直观地看到目标渲染页面。在遍历完成待渲染页面中的各待渲染元素后，得到与待渲染页面所对应的目标渲染页面。目标渲染页面中可以包括一个或者多个页面元素，如果目标渲染页面中包括一个页面元素，则该页面元素为已添加埋点属性的元素；如果目标渲染页面中包括多个页面元素，则多个页面元素中可以包括一个或者多个已为相应待渲染元素添加埋点属性的元素。

可选的，当检测到触发目标渲染页面中的页面元素，且页面元素中包括埋点属性时，上报与页面元素相对应的埋点数据。

其中，埋点数据为与页面元素相对应的用户行为数据，埋点数据可以包括浏览量、点击率、访问页面元素的不同IP地址的人数等信息。

在本实施例中，可以为目标渲染页面中的页面元素设置触发控件，用户可以触发相应的控件点击页面元素。如果用户触发目标渲染页面中的某个页面元素对应的控件，且该页面元素中包括埋点属性，埋点属性中既包括该页面元素的目标编译环境所对应的编译标识以及目标埋点值，则上报这个页面元素对应的埋点数据。这样设置的好处在于：上报设有埋点页面元素的埋点数据，服务器可以以此数据为依据，为用户精准推荐相关内容，达到精准推荐的目的，或者，以此数据为支撑，调整后续业务方向。

示例性的，参见图7，用户触发页面元素上对应的控件，且该页面元素中包括埋点属性，此时可以通过劫持用户的触发事件，获取触发的页面元素上的埋点属性，如果页面元素对应的目标编译环境是H5，则获取到的目标编译环境所对应的编译标识为clstag，随后，读取对应页面元素的埋点数据，并通过接口的形式上报埋点数据。

可选的，当检测到触发目标渲染页面中已为待渲染元素添加埋点属性的页面元素，且页面元素中未包括与目标编译环境相对应的编译标识时，调取目标函数，以基于目标函数获取与页面元素相对应的虚拟元素上的编译标识赋值至页面元素；以及，上报与页面元素相对应的埋点数据。

其中，目标函数为可以获取虚拟元素编译标识的函数。虚拟元素可以理解为不是待渲染页面中包含的待渲染元素，并非真实需要绘制出的元素。

需要特别说明的是，待渲染元素的埋点属性在确定之后，进行数据传输的过程中，可能会丢失部分属性内容，例如，待渲染元素埋点属性中与目标编译环境相对应的编译标识可能会丢失。

在本实施例中，如果用户触发目标渲染页面中的某个页面元素对应的控件，且该页面元素中并不包括与目标编译环境相对应的编译标识时，直接调取目标函数，目标函数可以获取与该页面元素对应的虚拟元素上的编译标识，进一步的，将虚拟元素的编译标识作为该页面元素的编译标识。最后，上报该页面元素对应的埋点数据。这样设置的好处在于：如果待渲染元素埋点属性中与目标编译环境相对应的编译标识发生丢失的情形，可以通过目标函数确定与之对应的虚拟元素上的编译标识，以弥补数据丢失造成的后果，保证可以基于埋点属性上报与页面元素相对应的埋点数据。

示例性的，参见图7，用户触发页面元素上对应的控件，页面元素对应的目标编译环境是小程序，如果小程序的埋点属性中包括data-cls编译标识，则读取对应页面元素的埋点数据，并通过接口的形式上报埋点数据。如果小程序的埋点属性中未包括data-cls编译标识，此时可以调用目标函数getElementById，获取到对应的虚拟元素，然后获取虚拟元素上的编译标识data-cls，作为该页面元素的编译标识。最后，基于埋点属性中的目标编译环境编译标识以及埋点值读取对应页面元素的埋点数据，并通过接口的形式上报埋点数据。

本发明实施例的技术方案，首先接收页面渲染指令，进而根据页面渲染指令遍历待渲染页面中每个待渲染元素，并在待渲染元素中包括埋点指令时，调取目标数据模型，进一步的，根据待渲染元素所属的目标编译环境，埋点指令所携带的埋点字段以及目标数据模型，确定待渲染元素的目标埋点值，随后，基于目标埋点值和相应的目标编译环境为待渲染元素添加埋点属性，最后，得到与待渲染页面所对应的目标渲染页面。本发明实施例的技术方案，基于目标渲染页面上的触发操作，可以实现基于埋点属性上报设有埋点页面元素的埋点数据，进而有效利用埋点数据。

图8为本发明实施例所提供的一种应用于页面中的埋点装置的结构示意图，该装置包括：渲染指令接收模块510、数据模型调取模块520、埋点属性添加模块530以及埋点属性添加模块540。

渲染指令接收模块510，用于接收页面渲染指令；

数据模型调取模块520，用于根据所述页面渲染指令遍历待渲染页面中每个待渲染元素，并在所述待渲染元素中包括埋点指令时，调取目标数据模型；其中，所述目标数据模型中包括各编译环境下所对应的埋点值；

目标埋点值确定模块530，用于根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值；

埋点属性添加模块540，用于基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性。

在上述装置的基础上，目标埋点值确定模块530还包括编译环境确定单元、待选择埋点值确定单元和目标埋点值确定单元。

编译环境确定单元，用于确定所述待渲染元素所对应的目标编译环境；

待选择埋点值确定单元，用于根据所述埋点指令中所对应的埋点字段，从所述目标数据模型中确定至少一个待选择埋点值；

目标埋点值确定单元，用于根据所述目标编译环境从所述至少一个待选择埋点值中，确定出所述目标埋点值。

在上述装置的基础上，埋点属性添加模块540包括埋点属性添加单元。

埋点属性添加单元，用于将所述目标编译环境所对应的编译标识以及所述目标埋点值，添加至所述待渲染元素所对应的埋点属性中。

在上述装置的基础上，上述装置还包括：待埋点元素列表获取单元和目标埋点值获取单元。

待埋点元素列表获取单元，用于获取预先设置的待埋点元素列表；

目标埋点值获取单元，用于基于所述待埋点元素列表为相应待渲染元素添加埋点指令；其中，所述埋点指令中包括埋点字段，以基于所述埋点字段从所述目标数据模型中获取相应的目标埋点值。

在上述装置的基础上，上述装置还包括：埋点值确定单元以及目标数据模型确定单元。

埋点值确定单元，用于确定各编译环境下所对应的埋点值；

目标数据模型确定单元，用于根据所述编译环境以及相应的埋点值，确定所述目标数据模型。

在上述装置的基础上，上述装置还包括：新增埋点值确定单元以及目标埋点值确定单元。

新增埋点值确定单元，用于当接收到新增编译环境的新增指令时，确定所述新增编译环境所对应的待渲染元素和相应的埋点值；

目标埋点值确定单元，用于基于所述待渲染元素和相应的埋点值更新所述目标数据模型，以在接收到页面渲染指令时，基于更新后的目标数据模型确定相应编译环境下待渲染元素的目标埋点值。

在上述装置的基础上，上述装置还包括：目标渲染页面得到单元，用于在遍历完成所述待渲染页面中的各待渲染元素之后，得到与所述待渲染页面所对应的目标渲染页面；其中，所述目标渲染页面中包括至少一个页面元素，所述至少一个页面元素中包括已为相应待渲染元素添加埋点属性的元素。

在上述装置的基础上，上述装置还包括：埋点数据上报单元，用于当检测到触发所述目标渲染页面中的页面元素，且所述页面元素中包括埋点属性时，上报与所述页面元素相对应的埋点数据。

在上述装置的基础上，上述装置还包括：虚拟元素获取单元，用于当检测到触发所述目标渲染页面中已为待渲染元素添加埋点属性的页面元素，且所述页面元素中未包括与所述目标编译环境相对应的编译标识时，调取目标函数，以基于所述目标函数获取与所述页面元素相对应的虚拟元素上的编译标识赋值至所述页面元素；以及，上报与所述页面元素相对应的埋点数据。

本发明实施例的技术方案，首先接收页面渲染指令，进而根据页面渲染指令遍历待渲染页面中每个待渲染元素，并在待渲染元素中包括埋点指令时，调取目标数据模型，进一步的，根据待渲染元素所属的目标编译环境，埋点指令所携带的埋点字段以及目标数据模型，确定待渲染元素的目标埋点值，最后，基于目标埋点值和相应的目标编译环境为待渲染元素添加埋点属性。本发明实施例的技术方案，解决了半自动埋点方式需要人工设置不同端所对应的埋点值，导致工作量较大、工作效率低的技术问题，通过目标数据模型定义不同编译环境对应的埋点值，在对待渲染元素进行埋点时，可以直接调用目标数据模型读取与待渲染元素相对应的目标埋点值，基于目标埋点值为待渲染元素添加埋点属性，便可以实现待渲染元素的埋点处理，同时，在后续增加新的编译环境页面元素时，只需要在目标数据模型中定义新的编译环境以及埋点值即可，无需遍历再添加新增的埋点值，这样一来可以节约埋点处理时间和计算机资源，实现了埋点方案的优化，从而提高了埋点的工作效率。

本发明实施例所提供的应用于页面中的埋点装置可执行本发明任意实施例所提供的应用于页面中的埋点方法，具备执行方法相应的功能模块和有益效果。

值得注意的是，上述系统所包括的各个单元和模块只是按照功能逻辑进行划分的，但并不局限于上述的划分，只要能够实现相应的功能即可；另外，各功能单元的具体名称也只是为了便于相互区分，并不用于限制本发明实施例的保护范围。

图9为本发明实施例所提供的一种电子设备的结构示意图。图9示出了适于用来实现本发明实施例实施方式的示例性电子设备60的框图。图9显示的电子设备60仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。

如图9所示，电子设备60以通用计算设备的形式表现。电子设备60的组件可以包括但不限于：一个或者多个处理器或者处理单元601，系统存储器602，连接不同系统组件(包括系统存储器602和处理单元601)的总线603。

总线603表示几类总线结构中的一种或多种，包括存储器总线或者存储器控制器，外围总线，图形加速端口，处理器或者使用多种总线结构中的任意总线结构的局域总线。举例来说，这些体系结构包括但不限于工业标准体系结构(ISA)总线，微通道体系结构(MAC)总线，增强型ISA总线、视频电子标准协会(VESA)局域总线以及外围组件互连(PCI)总线。

电子设备60典型地包括多种计算机系统可读介质。这些介质可以是任何能够被电子设备60访问的可用介质，包括易失性和非易失性介质，可移动的和不可移动的介质。

系统存储器602可以包括易失性存储器形式的计算机系统可读介质，例如随机存取存储器(RAM)604和/或高速缓存存储器605。电子设备60可以进一步包括其它可移动/不可移动的、易失性/非易失性计算机系统存储介质。仅作为举例，存储系统606可以用于读写不可移动的、非易失性磁介质(图9未显示，通常称为“硬盘驱动器”)。尽管图9中未示出，可以提供用于对可移动非易失性磁盘(例如“软盘”)读写的磁盘驱动器，以及对可移动非易失性光盘(例如CD-ROM，DVD-ROM或者其它光介质)读写的光盘驱动器。在这些情况下，每个驱动器可以通过一个或者多个数据介质接口与总线603相连。存储器602可以包括至少一个程序产品，该程序产品具有一组(例如至少一个)程序模块，这些程序模块被配置以执行本发明各实施例的功能。

具有一组(至少一个)程序模块607的程序/实用工具608，可以存储在例如存储器602中，这样的程序模块607包括但不限于操作系统、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。程序模块607通常执行本发明所描述的实施例中的功能和/或方法。

电子设备60也可以与一个或多个外部设备609(例如键盘、指向设备、显示器810等)通信，还可与一个或者多个使得用户能与该电子设备60交互的设备通信，和/或与使得该电子设备60能与一个或多个其它计算设备进行通信的任何设备(例如网卡，调制解调器等等)通信。这种通信可以通过输入/输出(I/O)接口611进行。并且，电子设备60还可以通过网络适配器612与一个或者多个网络(例如局域网(LAN)，广域网(WAN)和/或公共网络，例如因特网)通信。如图所示，网络适配器612通过总线603与电子设备60的其它模块通信。应当明白，尽管图9中未示出，可以结合电子设备60使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储系统等。

处理单元601通过运行存储在系统存储器602中的程序，从而执行各种功能应用以及数据处理，例如实现本发明实施例所提供的应用于页面中的埋点方法。

本发明实施例还提供一种包含计算机可执行指令的存储介质，计算机可执行指令在由计算机处理器执行时用于执行一种应用于页面中的埋点方法，方法应用于移动端中，该方法包括：

接收页面渲染指令；

根据所述页面渲染指令遍历待渲染页面中每个待渲染元素，并在所述待渲染元素中包括埋点指令时，调取目标数据模型；其中，所述目标数据模型中包括各编译环境下所对应的埋点值；

根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值；

基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性。

本发明实施例的计算机存储介质，可以采用一个或多个计算机可读的介质的任意组合。计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本文件中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。

计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。

计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括——但不限于无线、电线、光缆、RF等等，或者上述的任意合适的组合。

可以以一种或多种程序设计语言或其组合来编写用于执行本发明实施例操作的计算机程序代码，程序设计语言包括面向对象的程序设计语言—诸如Java、Smalltalk、C++，还包括常规的过程式程序设计语言——诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络——包括局域网(LAN)或广域网(WAN)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。

注意，上述仅为本发明的较佳实施例及所运用技术原理。本领域技术人员会理解，本发明不限于这里的特定实施例，对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本发明的保护范围。因此，虽然通过以上实施例对本发明进行了较为详细的说明，但是本发明不仅仅限于以上实施例，在不脱离本发明构思的情况下，还可以包括更多其他等效实施例，而本发明的范围由所附的权利要求范围决定。

Claims (12)

1.一种应用于页面中的埋点方法，其特征在于，包括：

接收页面渲染指令；

根据所述页面渲染指令遍历待渲染页面中每个待渲染元素，并在所述待渲染元素中包括埋点指令时，调取目标数据模型；其中，所述目标数据模型中包括各编译环境下所对应的埋点值；

根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值；

基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性。

2.根据权利要求1所述的方法，其特征在于，还包括：

获取预先设置的待埋点元素列表；

基于所述待埋点元素列表为相应待渲染元素添加埋点指令；其中，所述埋点指令中包括埋点字段，以基于所述埋点字段从所述目标数据模型中获取相应的目标埋点值。

3.根据权利要求1所述的方法，其特征在于，还包括：

确定各编译环境下所对应的埋点值；

根据所述编译环境以及相应的埋点值，确定所述目标数据模型。

4.根据权利要求1所述的方法，其特征在于，所述根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值，包括：

确定所述待渲染元素所对应的目标编译环境；

根据所述埋点指令中所对应的埋点字段，从所述目标数据模型中确定至少一个待选择埋点值；

根据所述目标编译环境从所述至少一个待选择埋点值中，确定出所述目标埋点值。

5.根据权利要求1所述的方法，其特征在于，所述基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性，包括：

将所述目标编译环境所对应的编译标识以及所述目标埋点值，添加至所述待渲染元素所对应的埋点属性中。

6.根据权利要求1所述的方法，其特征在于，还包括：

当接收到新增编译环境的新增指令时，确定所述新增编译环境所对应的待渲染元素和相应的埋点值；

基于所述待渲染元素和相应的埋点值更新所述目标数据模型，以在接收到页面渲染指令时，基于更新后的目标数据模型确定相应编译环境下待渲染元素的目标埋点值。

7.根据权利要求1所述的方法，其特征在于，还包括：

在遍历完成所述待渲染页面中的各待渲染元素之后，得到与所述待渲染页面所对应的目标渲染页面；

其中，所述目标渲染页面中包括至少一个页面元素，所述至少一个页面元素中包括已为相应待渲染元素添加埋点属性的元素。

8.根据权利要求7所述的方法，其特征在于，还包括：

当检测到触发所述目标渲染页面中的页面元素，且所述页面元素中包括埋点属性时，上报与所述页面元素相对应的埋点数据。

9.根据权利要求7所述的方法，其特征在于，还包括：

当检测到触发所述目标渲染页面中已为待渲染元素添加埋点属性的页面元素，且所述页面元素中未包括与所述目标编译环境相对应的编译标识时，调取目标函数，以基于所述目标函数获取与所述页面元素相对应的虚拟元素上的编译标识赋值至所述页面元素；以及，

上报与所述页面元素相对应的埋点数据。

10.一种应用于页面中的埋点装置，其特征在于，所述装置包括：

渲染指令接收模块，用于接收页面渲染指令；

数据模型调取模块，用于根据所述页面渲染指令遍历待渲染页面中每个待渲染元素，并在所述待渲染元素中包括埋点指令时，调取目标数据模型；其中，所述目标数据模型中包括各编译环境下所对应的埋点值；

目标埋点值确定模块，用于根据所述待渲染元素所属的目标编译环境，所述埋点指令所携带的埋点字段以及所述目标数据模型，确定所述待渲染元素的目标埋点值；

埋点属性添加模块，用于基于所述目标埋点值和相应的目标编译环境为所述待渲染元素添加埋点属性。

11.一种电子设备，其特征在于，所述电子设备包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-9任一项所述的应用于页面中的埋点方法。

12.一种包含计算机可执行指令的存储介质，所述计算机可执行指令在由计算机处理器执行时用于执行如权利要求1-9任一项所述的应用于页面中的埋点方法。

Images