1.本技术涉及数据处理领域，特别是涉及一种基于aop对组件进行动态埋点的方法、装置及应用。
背景技术：2.在数据分析领域，通常将用户在应用中的行为称为事件，如搜索商品、滚动商品列表、浏览商品详情页、将商品加入购物车、支付订单等行为都可称之为事件。用户的所有行为都会有相关的代码运行，如用户打开了一个页面，该页面的代码就会加载；只要研发在开发功能时为事件植入一段监控代码，当事件被触发时，让事件的监控代码同步执行，就可以按约定的方式和结构，采集该事件的相关信息，并上报到服务器。这种对需要对关注的特定事件进行数据采集和上报的解决方案，就是数据埋点。换言之，数据埋点指的是对特定用户行为或事件进行捕获、处理和发送的相关技术及其实施过程。
3.在设计数据埋点方案时，根据业务和数据分析的需要设计需要监控的若干个事件，并交由开发实现；代码埋点主要由研发工程师手工在程序中写代码实现，通过触发某个动作后程序自动发送数据。
4.但是目前前端应用在数据采集和用户行为分析过程中会存在以下问题：
5.1.在代码埋点过程中，会破坏代码规范性并增加代码的耦合度，不利于维护性。
6.2.业务代码和埋点代码混合在一起，缺少可复用性。
7.3.每次修改埋点代码时需要重新发布版本，增加了人力成本、时间成本，不利于统计埋点信息。
技术实现要素：8.本技术实施例提供了一种基于aop对组件进行动态埋点的方法、装置及应用，也以组件注册作为切入点，在不需要改变组件的原始代码实现动态代码埋点，实现代码埋点和业务埋点的完全解耦，减少成本开销。
9.第一方面，本技术实施例提供了一种基于aop对组件进行动态埋点的方法，所述方法包括：
10.在vue项目中引入至少一待埋点vue组件以及埋点插件；
11.在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件，所述埋点配置文件配置所述待埋点vue组件的识别信息、对应所述待埋点vue组件需要执行的埋点函数以及所述埋点函数对应的切入目标函数；
12.通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数，在vue项目内代码注入所述埋点函数；
13.注册所述待埋点vue组件。
14.第二方面，本技术实施例提供了一种基于aop对组件进行动态埋点的装置，包括：
15.引入模块，用于在vue项目中引入至少一待埋点vue组件以及埋点插件；
16.埋点配置模块，用于在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件，所述埋点配置文件配置所述待埋点vue组件的识别信息、对应所述待埋点vue组件需要执行的埋点函数以及所述埋点函数对应的切入目标函数；
17.埋点注入模块，用于通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数，在vue项目内代码注入所述埋点函数；
18.组件注册模块，用于注册所述待埋点vue组件。
19.第三方面，本技术实施例提供了一种电子装置，包括存储器和处理器，其特征在于，所述存储器中存储有计算机程序，所述处理器被设置为运行所述计算机程序以执行所述的基于aop对vue组件进行动态埋点的方法。
20.第四方面，本技术实施例提供了一种计算机程序产品，包括软件代码部分，当所述计算机程序产品在计算机上被运行时，所述软件代码部分用于执行所述的基于aop对vue组件进行动态埋点的方法。
21.第五方面，本技术实施例提供了一种可读存储介质，所述可读存储介质中存储有计算机程序，所述计算机程序包括用于控制过程以执行过程的程序代码，所述过程包括所述的基于aop对vue组件进行动态埋点的方法。
22.本发明的主要贡献和创新点如下：
23.本技术方案提供的基于aop对组件进行动态埋点的方法、装置及应用，在埋点插件内配置埋点配置文件，在不影响vue组件的组件代码的基础上实现了对vue组件的埋点设置，且可实现动态埋点。
24.本技术的一个或多个实施例的细节在以下附图和描述中提出，以使本技术的其他特征、目的和优点更加简明易懂。
附图说明
25.此处所说明的附图用来提供对本技术的进一步理解，构成本技术的一部分，本技术的示意性实施例及其说明用于解释本技术，并不构成对本技术的不当限定。在附图中：
26.图1是根据本技术实施例的基于aop对组件进行动态埋点的方法的流程图；
27.图2是根据本技术一种实施例的基于aop对组件进行动态埋点的方法的逻辑流程图；
28.图3是根据本技术实施例的基于aop对组件进行动态埋点的装置的结构框图；
29.图4是根据本技术实施例的电子装置的硬件结构示意图。
具体实施方式
30.这里将详细地对示例性实施例进行说明，其示例表示在附图中。下面的描述涉及附图时，除非另有表示，不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本说明书一个或多个实施例相一致的所有实施方式。相反，它们仅是与如所附权利要求书中所详述的、本说明书一个或多个实施例的一些方面相一致的装置和方法的例子。
31.需要说明的是：在其他实施例中并不一定按照本说明书示出和描述的顺序来执行相应方法的步骤。在一些其他实施例中，其方法所包括的步骤可以比本说明书所描述的更
多或更少。此外，本说明书中所描述的单个步骤，在其他实施例中可能被分解为多个步骤进行描述；而本说明书中所描述的多个步骤，在其他实施例中也可能被合并为单个步骤进行描述。
32.在介绍本方案之前，首先对本方案可能涉及的专业名称进行解释：
33.aop：面向切面编程，通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术。aop是oop的延续，是软件开发中的一个热点，利用aop可以对业务逻辑的各个部分进行隔离，从而使得业务逻辑各部分之间的耦合度降低，提高程序的可重用性，同时提高了开发的效率。
34.组件(component)：是vue.js最强大的功能之一，组件可以扩展html元素，封装可重用的代码。在较高层面上，组件是自定义元素，vue.js的编译器为它添加特殊功能。
35.cdn:全称是content delivery network，即内容分发网络，它能够实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。
36.npm：是node的模块管理器，只要一行命令，就能安装别人写好的模块。
37.实施例一
38.如图1所示，本技术实施例提供了一种基于aop对vue组件进行动态埋点的方法，可以实现无需修改组件的业务代码的基础上实现动态埋点的目的，具体地，参考图1，所述方法包括：
39.在vue项目中引入至少一待埋点vue组件以及埋点插件；
40.在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件，所述埋点配置文件配置所述待埋点vue组件的识别信息、对应所述待埋点vue组件需要执行的埋点函数以及所述埋点函数对应的切入目标函数；
41.通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数，在vue项目内代码注入所述埋点函数；
42.注册所述待埋点vue组件。
[0043]“在vue项目中引入至少一待埋点vue组件以及埋点插件”步骤中，待埋点vue组件和所述埋点插件以npm方式引入vue项目中。本方案在vue项目中分别引入埋点插件和待埋点vue组件的方式，使得待埋点vue组件通过埋点插件的使用进行埋点，用户不需要修改组件内部的业务代码，以此实现了埋点代码和业务代码的完全解耦。
[0044]
在一些实施例中，可通过cdn的方式引入所述埋点插件，这样的方式可提高埋点效率。也就是说，所述埋点插件写在cdn服务器上。
[0045]“在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件”步骤中，针对每一埋点配置文件导出为对应的javascript文件。也就是说，在埋点配置文件配置完毕后，将所述埋点配置文件单独导出为javascript文件，若需要修改或者替换埋点配置方案时，可在不影响组件代码的情况下直接修改或替换原始埋点配置文件，进而实现了动态新增、修改、删除埋点的功能。
[0046]
对应的，当需要修改所述埋点配置文件时只需要单独对所述埋点配置文件内的配置信息进行对应修改即可，若需要修改待埋点vue组件的话就更改所述所述待埋点vue组件的识别信息；若需要修改埋点函数的话就更改所述埋点配置文件中的所述埋点函数即可。
[0047]
值得一提的是，所述埋点配置文件用于声明埋点配置内容。所述埋点配置文件对应所有的待埋点vue组件，对应的，所述埋点配置文件为一个集合，集合内的每一项都对应一个待埋点vue组件的埋点声明。
[0048]
具体的，所述埋点配置文件内配置的所述待埋点vue组件的识别信息用于声明待埋点vue组件；所述埋点函数用于声明需要执行的函数；所述切入目标函数用于声明埋点函数对应的切入函数。在一些实施例中，所述埋点配置文件内还配置函数执行时间，其中所述函数执行时间声明埋点函数的具体执行时间。通常来说，所述函数执行时间有：before、after、around，分别表示在目标方法执行前、执行后和执行前后都运行的逻辑代码。
[0049]
示例性的，所述埋点配置文件如图1所示，图中的component对应所述所述待埋点vue组件的识别信息，type对应所述函数执行时间；method对应所述切入目标函数，functions对应需要执行的埋点函数。
[0050]
在“通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数”步骤中，以vue.component()函数作为所处埋点插件的aop切入点，以所述切入目标函数匹配所述待埋点vue组件内部的埋点方法。本方案利用vue项目的vue.component组件注册机制，进而实现埋点设置。
[0051]
在该步骤中，埋点插件会在所述待埋点vue组件内部遍历查找所述切入目标函数，若有的话则获取所述埋点配置文件中的对应所述切入目标函数的埋点函数，若遍历后并没有找到对应的切入目标函数的话就自动忽略所述埋点配置文件。
[0052]
在“在vue项目内代码注入所述埋点函数”步骤中，注入的代码为所述埋点配置的functions选项，所述functions选项内存放埋点函数。
[0053]
另外，将所有匹配到的埋点方法进行代码注入后还将执行结果按格式打印至日志中。
[0054]
值得一提的是，在“在vue项目内代码注入所述埋点函数”步骤中，可注入多个埋点函数，此时多个所述埋点函数按照设定的索引顺序依次执行。所述埋点函数内可记录时间差，统计时长，输出自定义格式日志等操作。
[0055]
通过以上方法已可将埋点函数代码埋点注入到待埋点vue组件中，随后进行注册所述待埋点vue组件的操作。埋点完成后的埋点信息将上报至埋点服务器上，其中需要说明的是，埋点服务器为接收客户端上因触发埋点所产生的反馈信息。进一步地，客户端上触发埋点上报，埋点服务器通过反馈信息查询、计算得出对应数据，并更新补充到cdn服务器上的埋点配置文件，从而实现自动化动态配置埋点的功能。
[0056]
示例性，若本实施例中需要对页面组件中的按钮a和按钮b进行点击事件的埋点。则所述页面组件作为待埋点vue组件，本方案在埋点服务器内对该页面组件编写一份埋点配置文件，所述埋点配置文件的所述切入目标函数编写：在按钮a所绑定的点击事件方法进行埋点切入，对应所述切入目标函数的所述埋点配置文件的埋点函数为收集该按钮的点击次数，埋点配置文件的函数执行时间的参数这里为after，因为需要点击事件完成后，才完成埋点收集，此时埋点配置文件已编写完毕，利用上述方案实现待埋点vue组件的代码埋点。
[0057]
通过客户端触发上报埋点，埋点服务器收集到按钮a的点击量并进行数据分析，当分析到按钮a的点击量介于某个有意义的阈值后，通过自定义编写的脚本文件，动态修改埋
点服务器上的埋点配置文件，修改内容可以为：修改切入目标函数：停止对按钮a的埋点分析，改为对按钮b的埋点分析，从而实现动态配置埋点的方案。
[0058]
实施例二
[0059]
基于相同的构思，参考图3，本技术还提出了一种基于aop对vue组件进行动态埋点的装置，包括：
[0060]
引入模块301，用于在vue项目中引入至少一待埋点vue组件以及埋点插件；
[0061]
埋点配置模块302，用于在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件，所述埋点配置文件配置所述待埋点vue组件的识别信息、对应所述待埋点vue组件需要执行的埋点函数以及所述埋点函数对应的切入目标函数；
[0062]
埋点注入模块303，用于通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数，在vue项目内代码注入所述埋点函数；
[0063]
组件注册模块304，用于注册所述待埋点vue组件。
[0064]
关于该实施例二内涉及的技术内容同于实施例一内记载内容的，可参见实施例一介绍内容，重复内容在此不进行累赘说明。
[0065]
实施例三
[0066]
本实施例还提供了一种电子装置，参考图4，包括存储器404和处理器402，该存储器404中存储有计算机程序，该处理器402被设置为运行计算机程序以执行上述任一项基于aop对vue组件进行动态埋点的方法实施例中的步骤。
[0067]
具体地，上述处理器402可以包括中央处理器(cpu)，或者特定集成电路(applicationspecificintegratedcircuit，简称为asic)，或者可以被配置成实施本技术实施例的一个或多个集成电路。
[0068]
其中，存储器404可以包括用于数据或指令的大容量存储器404。举例来说而非限制，存储器404可包括硬盘驱动器(harddiskdrive，简称为hdd)、软盘驱动器、固态驱动器(solidstatedrive，简称为ssd)、闪存、光盘、磁光盘、磁带或通用串行总线(universalserialbus，简称为usb)驱动器或者两个或更多个以上这些的组合。在合适的情况下，存储器404可包括可移除或不可移除(或固定)的介质。在合适的情况下，存储器404可在数据处理装置的内部或外部。在特定实施例中，存储器404是非易失性(non-volatile)存储器。在特定实施例中，存储器404包括只读存储器(read-onlymemory，简称为rom)和随机存取存储器(randomaccessmemory，简称为ram)。在合适的情况下，该rom可以是掩模编程的rom、可编程rom(programmableread-onlymemory，简称为prom)、可擦除prom(erasableprogrammableread-onlymemory，简称为eprom)、电可擦除prom(electricallyerasableprogrammableread-onlymemory，简称为eeprom)、电可改写rom(electricallyalterableread-onlymemory，简称为earom)或闪存(flash)或者两个或更多个以上这些的组合。在合适的情况下，该ram可以是静态随机存取存储器(staticrandom-accessmemory，简称为sram)或动态随机存取存储器(dynamicrandomaccessmemory，简称为dram)，其中，dram可以是快速页模式动态随机存取存储器404(fastpagemodedynamicrandomaccessmemory，简称为fpmdram)、扩展数据输出动态随机存取存储器(extendeddateoutdynamicrandomaccessmemory，简称为edodram)、同步动态随机存取内存(synchronousdynamicrandom-accessmemory，简称sdram)等。
[0069]
存储器404可以用来存储或者缓存需要处理和/或通信使用的各种数据文件，以及处理器402所执行的可能的计算机程序指令。
[0070]
处理器402通过读取并执行存储器404中存储的计算机程序指令，以实现上述实施例中的任意一种基于aop对vue组件进行动态埋点的方法。
[0071]
可选地，上述电子装置还可以包括传输设备406以及输入输出设备408，其中，该传输设备406和上述处理器402连接，该输入输出设备408和上述处理器402连接。
[0072]
传输设备406可以用来经由一个网络接收或者发送数据。上述的网络具体实例可包括电子装置的通信供应商提供的有线或无线网络。在一个实例中，传输设备包括一个网络适配器(network interface controller，简称为nic)，其可通过基站与其他网络设备相连从而可与互联网进行通讯。在一个实例中，传输设备406可以为射频(radio frequency，简称为rf)模块，其用于通过无线方式与互联网进行通讯。
[0073]
可选地，在本实施例中，上述处理器402可以被设置为通过计算机程序执行以下步骤：
[0074]
在vue项目中引入至少一待埋点vue组件以及埋点插件；
[0075]
在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件，所述埋点配置文件配置所述待埋点vue组件的识别信息、对应所述待埋点vue组件需要执行的埋点函数以及所述埋点函数对应的切入目标函数；
[0076]
通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数，在vue项目内代码注入所述埋点函数；
[0077]
注册所述待埋点vue组件。
[0078]
需要说明的是，本实施例中的具体示例可以参考上述实施例及可选实施方式中所描述的示例，本实施例在此不再赘述。
[0079]
通常，各种实施例可以以硬件或专用电路、软件、逻辑或其任何组合来实现。本发明的一些方面可以以硬件来实现，而其他方面可以以可以由控制器、微处理器或其他计算设备执行的固件或软件来实现，但是本发明不限于此。尽管本发明的各个方面可以被示出和描述为框图、流程图或使用一些其他图形表示，但是应当理解，作为非限制性示例，本文中描述的这些框、装置、系统、技术或方法可以以硬件、软件、固件、专用电路或逻辑、通用硬件或控制器或其他计算设备或其某种组合来实现。
[0080]
本发明的实施例可以由计算机软件来实现，该计算机软件由移动设备的数据处理器诸如在处理器实体中可执行，或者由硬件来实现，或者由软件和硬件的组合来实现。包括软件例程、小程序和/或宏的计算机软件或程序(也称为程序产品)可以存储在任何装置可读数据存储介质中，并且它们包括用于执行特定任务的程序指令。计算机程序产品可以包括当程序运行时被配置为执行实施例的一个或多个计算机可执行组件。一个或多个计算机可执行组件可以是至少一个软件代码或其一部分。另外，在这一点上，应当注意，如图中的逻辑流程的任何框可以表示程序步骤、或者互连的逻辑电路、框和功能、或者程序步骤和逻辑电路、框和功能的组合。软件可以存储在诸如存储器芯片或在处理器内实现的存储块等物理介质、诸如硬盘或软盘等磁性介质、以及诸如例如dvd及其数据变体、cd等光学介质上。物理介质是非瞬态介质。
[0081]
本领域的技术人员应该明白，以上实施例的各技术特征可以进行任意的组合，为
使描述简洁，未对上述实施例中的各个技术特征所有可能的组合都进行描述，然而，只要这些技术特征的组合不存在矛盾，都应当认为是本说明书记载的范围。
[0082]
以上实施例仅表达了本技术的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对本技术范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本技术构思的前提下，还可以做出若干变形和改进，这些都属于本技术的保护范围。因此，本技术的保护范围应以所附权利要求为准。
技术特征：1.一种基于aop对vue组件进行动态埋点的方法，其特征在于，包括：在vue项目中引入至少一待埋点vue组件以及埋点插件；在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件，所述埋点配置文件配置所述待埋点vue组件的识别信息、对应所述待埋点vue组件需要执行的埋点函数以及所述埋点函数对应的切入目标函数；通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数，在vue项目内代码注入所述埋点函数；注册所述待埋点vue组件。2.根据权利要求1所述的基于aop对vue组件进行动态埋点的方法，其特征在于，“在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件”步骤中，针对每一埋点配置文件导出为对应的javascript文件。3.根据权利要求1所述的基于aop对vue组件进行动态埋点的方法，其特征在于，“通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数”步骤中，埋点插件在所述待埋点vue组件内部遍历查找所述切入目标函数，若有的话则获取所述埋点配置文件中的对应所述切入目标函数的埋点函数，若遍历后并没有找到对应的切入目标函数的话就自动忽略所述埋点配置文件。4.根据权利要求1所述的基于aop对vue组件进行动态埋点的方法，其特征在于，“通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数”步骤中，以vue.component()函数作为所处埋点插件的aop切入点，以所述切入目标函数匹配所述待埋点vue组件内部的埋点函数。5.根据权利要求1所述的基于aop对vue组件进行动态埋点的方法，其特征在于，“在vue项目内代码注入所述埋点函数”步骤中，注入多个埋点函数，多个所述埋点函数按照设定的索引顺序依次执行。6.根据权利要求1所述的基于aop对vue组件进行动态埋点的方法，其特征在于，埋点完成后的埋点信息将上报至埋点服务器上，埋点服务器接收客户端上因触发埋点所产生的反馈信息，埋点服务器通过反馈信息查询、计算得出对应数据，并更新补充到埋点服务器上的埋点配置文件。7.一种基于aop对vue组件进行动态埋点的装置，其特征在于，包括：引入模块，用于在vue项目中引入至少一待埋点vue组件以及埋点插件；埋点配置模块，用于在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件，所述埋点配置文件配置所述待埋点vue组件的识别信息、对应所述待埋点vue组件需要执行的埋点函数以及所述埋点函数对应的切入目标函数；埋点注入模块，用于通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数，在vue项目内代码注入所述埋点函数；组件注册模块，用于注册所述待埋点vue组件。8.一种电子装置，包括存储器和处理器，其特征在于，所述存储器中存储有计算机程序，所述处理器被设置为运行所述计算机程序以执行权利要求1到6任一所述的基于aop对vue组件进行动态埋点的方法。9.一种计算机程序产品，其特征在于，包括软件代码部分，当所述计算机程序产品在计
算机上被运行时，所述软件代码部分用于执行根据权利要求1-6任一项所述的基于aop对vue组件进行动态埋点的方法。10.一种可读存储介质，其特征在于，所述可读存储介质中存储有计算机程序，所述计算机程序包括用于控制过程以执行过程的程序代码，所述过程包括根据权利要求1至6任一项所述的基于aop对vue组件进行动态埋点的方法。
技术总结本申请提出了一种基于aop对组件进行动态埋点的方法、装置及应用，包括以下步骤：在vue项目中引入至少一待埋点vue组件以及埋点插件；在所述埋点插件内针对所有待埋点vue组件编写埋点配置文件，所述埋点配置文件配置所述待埋点vue组件的识别信息、对应所述待埋点vue组件需要执行的埋点函数以及所述埋点函数对应的切入目标函数；通过所述埋点配置文件的所述切入目标函数匹配所述待埋点vue组件内部的埋点函数，在vue项目内代码注入所述埋点函数；注册所述待埋点vue组件。注册所述待埋点vue组件。注册所述待埋点vue组件。
技术研发人员：朱淑敏 梁盛麟
受保护的技术使用者：城云科技（中国）有限公司
技术研发日：2022.05.10
技术公布日：2022/7/5
