本发明涉及移动互联网领域，特别涉及一种混合应用的埋点方法、移动终端及混合应用的埋点系统。
背景技术：
随着移动互联网业务场景越来越复杂，以Hybrid模式开发的应用越来越多，该类应用通常称为Hybrid应用，即混合应用，是介于Native应用(本地化应用)和Web应用(网页应用)之间的移动应用。在混合应用中，更多的页面采用HTML5(Hyper Text Markup Language 5，超文本标记语言第五版)进行编写，如果对混合应用进行埋点分析，那么需要对成百上千张网页页面进行统计，在庞大的业务背景下，急需要一种针对HTML5页面的可视化埋点技术，使得开发人员从巨大的劳动量中解放出来。
现有的可视化埋点方案只能够支持到针对原生控件的埋点，而HTML5页面是要运行在网络视图控件，即WebView控件中的，但WebView控件只是众多原生控件中的一个，当前方案仅仅能够支持到WebView控件这一层级，其内部的网页页面则是无法支持到埋点的。因此，需要提高一种新的混合应用的埋点方法来优化上述处理过程。
技术实现要素：
为此，本发明提供一种混合应用的埋点技术方案，以力图解决或者至少缓解上面存在的问题。
根据本发明的一个方面，提供一种混合应用的埋点方法，适于在移动终端中执行，移动终端中安装有混合应用且与网络服务器通信连接，该方法包括如下步骤：首先，遍历混合应用的当前页面的视图树，以查找到视图树中的网络视图控件；通过混合应用的原生框架层，向网络视图控件注入相应的JS接口和JS脚本，以实现原生框架层与网络视图控件的通信；响应截图指令，根据网络视图控件，获取当前页面的页面截图及页面控件信息；通过原生框架层将页面截图及页面控件信息上报至网络服务器，以指示网络服务器生成控件路径配置信息；接收网络服务器下发的控件路径配置信息，解析控件路径配置信息并映射到相应的控件上，以完成埋点。
可选地，在根据本发明的混合应用的埋点方法中，向网络视图控件注入相应的JS接口和JS脚本的步骤包括：在当前页面加载的过程中，向网络视图控件注入相应的JS接口；当网络视图控件关联页面视图中的网页页面加载完成后，向网络视图控件注入相应的JS脚本。
可选地，在根据本发明的混合应用的埋点方法中，根据网络视图控件，获取当前页面的页面截图及页面控件信息的步骤包括：获取当前页面中视图树的根控件；调用根控件对应的截屏函数对当前页面进行屏幕截图，以获取当前页面的页面截图。
可选地，在根据本发明的混合应用的埋点方法中，调用根控件对应的截屏函数对当前页面进行屏幕截图，以获取当前页面的页面截图的步骤包括：调用根控件对应的截屏函数对当前页面进行屏幕截图以获取屏幕图片，并将屏幕图片保存为Bitmap类型对象；根据从屏幕图片的Bitmap类型对象中获取的图片缩放比例重新调整屏幕图片的宽高，以获取当前页面的页面截图。
可选地，在根据本发明的混合应用的埋点方法中，页面控件信息包括原生页面控件信息和网页页面控件信息，根据网络视图控件，获取当前页面的页面截图及页面控件信息的步骤包括：遍历当前页面的视图树中的所有控件，以获取各控件的控件信息作为该当前页面的原生页面控件信息；当遍历到的控件是网络视图控件时，调用网络视图控件对应的JS方法，以获取网络视图控件关联页面视图里的网页页面中各控件的控件信息，作为该当前页面的网页页面控件信息。
可选地，在根据本发明的混合应用的埋点方法中，控件路径配置信息包括原生页面控件路径配置信息和网页页面控件路径配置信息，解析控件路径配置信息并映射到相应的控件上，以完成埋点的步骤包括：解析原生页面控件路径配置信息，以获取当前页面中网络视图控件的路径信息，并根据该路径信息查找到网络视图控件；解析网页页面控件路径配置信息，以获取网络视图控件关联页面视图里的网页页面中相应控件的路径信息；调用网络视图控件对应的URL加载方法，将网页页面中相应控件的路径信息传递至JS接口，以实现埋点。
根据本发明的又一个方面，提供一种移动终端，包括一个或多个处理器、存储器以及一个或多个程序，其中一个或多个程序存储在存储器中并被配置为由一个或多个处理器执行，一个或多个程序包括用于执行根据本发明的混合应用的埋点方法的指令。
根据本发明的又一个方面，提供一种存储一个或多个程序的计算机可读存储介质，一个或多个程序包括指令，指令当由移动终端执行时，使得移动终端执行根据本发明的混合应用的埋点方法。
根据本发明的又一个方面，提供一种混合应用的埋点方法，适于在混合应用的埋点系统中运行，该系统包括网络服务器及与该网络服务器通信连接的一个或多个移动终端，每个移动终端中安装有混合应用，该方法包括如下步骤：首先，对每一个移动终端，该移动终端遍历其安装的混合应用的当前页面的视图树，以查找到视图树中的网络视图控件；通过混合应用的原生框架层，向网络视图控件注入相应的JS接口和JS脚本，以实现原生框架层与网络视图控件的通信；响应截图指令，根据网络视图控件，获取当前页面的页面截图及页面控件信息；通过原生框架层将页面截图及页面控件信息上报至网络服务器；网络服务器根据接收到的、各移动终端上报的页面截图及页面控件信息，生成与各移动终端对应的控件路径配置信息，并将各控件路径配置信息发送至对应的移动终端；各移动终端接收网络服务器下发的、与其对应的控件路径配置信息，解析控件路径配置信息并映射到相应的控件上，以完成埋点。
可选地，在根据本发明的混合应用的埋点方法中，向网络视图控件注入相应的JS接口和JS脚本的步骤包括：在当前页面加载的过程中，向网络视图控件注入相应的JS接口；当网络视图控件关联页面视图中的网页页面加载完成后，向网络视图控件注入相应的JS脚本。
可选地，在根据本发明的混合应用的埋点方法中，根据网络视图控件，获取当前页面的页面截图及页面控件信息的步骤包括：获取当前页面中视图树的根控件；调用根控件对应的截屏函数对当前页面进行屏幕截图，以获取当前页面的页面截图。
可选地，在根据本发明的混合应用的埋点方法中，调用根控件对应的截屏函数对当前页面进行屏幕截图，以获取当前页面的页面截图的步骤包括：调用根控件对应的截屏函数对当前页面进行屏幕截图以获取屏幕图片，并将屏幕图片保存为Bitmap类型对象；根据从屏幕图片的Bitmap类型对象中获取的图片缩放比例重新调整屏幕图片的宽高，以获取当前页面的页面截图。
可选地，在根据本发明的混合应用的埋点方法中，页面控件信息包括原生页面控件信息和网页页面控件信息，根据网络视图控件，获取当前页面的页面截图及页面控件信息的步骤包括：遍历当前页面的视图树中的所有控件，以获取各控件的控件信息作为该当前页面的原生页面控件信息；当遍历到的控件是网络视图控件时，调用网络视图控件对应的JS方法，以获取网络视图控件关联页面视图里的网页页面中各控件的控件信息，作为该当前页面的网页页面控件信息。
可选地，在根据本发明的混合应用的埋点方法中，页面控件信息包括原生页面控件信息和网页页面控件信息，网络服务器根据接收到的、各移动终端上报的页面截图及页面控件信息，生成与各移动终端对应的控件路径配置信息的步骤包括：对每一个移动终端，网络服务器根据该移动终端上报的页面截图及页面控件信息，响应相应的埋点指令，对该页面控件信息所包括的原生页面控件信息和网页页面控件信息所对应的控件中、待埋点的控件添加触发事件；根据添加有触发事件的各控件的控件信息，生成与该移动终端对应的控件路径配置信息。
可选地，在根据本发明的混合应用的埋点方法中，控件路径配置信息包括原生页面控件路径配置信息和网页页面控件路径配置信息，解析控件路径配置信息并映射到相应的控件上，以完成埋点的步骤包括：解析原生页面控件路径配置信息，以获取当前页面中网络视图控件的路径信息，并根据该路径信息查找到网络视图控件；解析网页页面控件路径配置信息，以获取网络视图控件关联页面视图里的网页页面中相应控件的路径信息；调用网络视图控件对应的URL加载方法，将网页页面中相应控件的路径信息传递至JS接口，以实现埋点。
根据本发明的又一个方面，还提供一种混合应用的埋点系统，该系统包括网络服务器及与该网络服务器通信连接的一个或多个移动终端，每个移动终端中安装有混合应用，在该系统中：对每一个移动终端，该移动终端适于遍历其安装的混合应用的当前页面的视图树，以查找到视图树中的网络视图控件，通过混合应用的原生框架层，向网络视图控件注入相应的JS接口和JS脚本，以实现原生框架层与网络视图控件的通信，响应截图指令，根据网络视图控件，获取当前页面的页面截图及页面控件信息，通过原生框架层将页面截图及页面控件信息上报至网络服务器，以指示网络服务器生成控件路径配置信息，接收网络服务器下发的控件路径配置信息，解析控件路径配置信息并映射到相应的控件上，以完成埋点；网络服务器适于根据接收到的、各移动终端上报的页面截图及页面控件信息，生成与各移动终端对应的控件路径配置信息，并将各控件路径配置信息发送至对应的移动终端。
根据本发明的混合应用的埋点技术方案，首先在移动终端中查找到混合应用的当前页面的网络视图控件，通过注入JS接口和JS脚本来建立原生框架层与网络视图控件的通信，之后根据网络视图控件获取当前页面的页面截图及页面控件信息，通过原生框架层将页面截图及页面控件信息上报至网络服务器，以便网络服务器生成相应的控件路径配置信息，在移动终端接收到网络服务器下发的控件路径配置信息后，对其进行解析并映射到相应的控件上，以完成埋点。在上述技术方案中，原生框架层与网络视图控件之间的通信桥梁搭建后，借助原生框架层可将混合应用中当前页面的页面控件信息与页面截图上报网络服务器。而对网络服务器而言，其响应相应的埋点指令对各待埋点的控件添加触发事件，以生成控件路径配置信息。最后，移动终端根据该控件路径配置信息先查找到网络视图控件，再将该网络视图控件关联页面视图里的网页页面中相应控件的路径信息传递至JS接口，以实现混合应用的可视化埋点，无需对混合应用中大量的网页页面进行统计埋点，节约了人力资源和时间。
附图说明
为了实现上述以及相关目的，本文结合下面的描述和附图来描述某些说明性方面，这些方面指示了可以实践本文所公开的原理的各种方式，并且所有方面及其等效方面旨在落入所要求保护的主题的范围内。通过结合附图阅读下面的详细描述，本公开的上述以及其它目的、特征和优势将变得更加明显。遍及本公开，相同的附图标记通常指代相同的部件或元素。
图1示出了根据本发明的一个实施例的混合应用的埋点系统100的示意图；
图2示出了根据本发明的一个实施例的移动终端200的结构框图；
图3示出了根据本发明的一个实施例的混合应用的埋点方法300的流程图；
图4示出了根据本发明的一个实施例的混合应用的当前页面的示意图；以及
图5示出了根据本发明的又一个实施例的混合应用的埋点方法500的流程图。
具体实施方式
下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例，然而应当理解，可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本公开，并且能够将本公开的范围完整的传达给本领域的技术人员。
图1示出了根据本发明的一个实施例的混合应用的埋点系统100的示意图。应当指出，图1中的混合应用的埋点系统100仅是示例性的，在具体的实践情况中，混合应用的埋点系统100中可以有不同数量的移动终端和网络服务器，本发明对混合应用的埋点系统100中所包括的移动终端和网络服务器的数量不做限制。如图1所示，混合应用的埋点系统100包括移动终端200和网络服务器600。其中，移动终端200与网络服务器600通信连接，移动终端200可以是智能手机、平板电脑等，但不限于此。
以下将以移动终端200为例进行混合应用的埋点技术方案的说明。具体来说，移动终端200中安装有混合应用，将该混合应用记为A，混合应用A的当前页面记为B，则移动终端200遍历混合应用A的当前页面B的视图树，以查找到该视图树中的网络视图控件，即WebView控件，通过混合应用A的原生框架层，即Native层，向该网络视图控件注入相应的JS接口和JS脚本，以实现原生框架层与网络视图控件的通信。至此，移动终端200已经完成了对混合应用A埋点的初始化工作，搭建好了Native层和WebView控件之间通信的桥梁。此时，移动终端200响应截图指令，根据该网络视图控件，获取当前页面B的页面截图及页面控件信息，通过原生框架层将页面截图及页面控件信息上报至网络服务器600，以指示网络服务器600生成控件路径配置信息。网络服务器600根据接收到的、移动终端200上报的页面截图及页面控件信息，响应相应的埋点指令，对该页面控件信息所包括的原生页面控件信息和网页页面控件信息所对应的控件中、待埋点的控件添加触发事件，生成与移动终端200对应的控件路径配置信息，并将该控件路径配置信息发送至移动终端200。最后，移动终端200接收网络服务器600下发的控件路径配置信息，解析该控件路径配置信息并映射到相应的控件上，以完成埋点。
图2示出了根据本发明一个实施例的移动终端200的结构框图。移动终端200可以包括存储器接口202、一个或多个数据处理器、图像处理器和/或中央处理单元204、显示屏幕(图2中未示出)，以及外围接口206。
存储器接口202、一个或多个处理器204和/或外围接口206既可以是分立元件，也可以集成在一个或多个集成电路中。在移动终端200中，各种元件可以通过一条或多条通信总线或信号线来耦合。传感器、设备和子系统可以耦合到外围接口206，以便帮助实现多种功能。
例如，运动传感器210、光线传感器212和距离传感器214可以耦合到外围接口206，以方便定向、照明和测距等功能。其他传感器216同样可以与外围接口206相连，例如定位系统(例如GPS接收机)、温度传感器、生物测定传感器或其他感测设备，由此可以帮助实施相关的功能。
相机子系统220和光学传感器222可以用于方便诸如记录照片和视频剪辑的相机功能的实现，其中所述相机子系统和光学传感器例如可以是电荷耦合器件(CCD)或互补金属氧化物半导体(厘米OS)光学传感器。可以通过一个或多个无线通信子系统224来帮助实现通信功能，其中无线通信子系统可以包括射频接收机和发射机和/或光(例如红外)接收机和发射机。无线通信子系统224的特定设计和实施方式可以取决于移动终端200所支持的一个或多个通信网络。例如，移动终端200可以包括被设计成支持LTE、3G、GSM网络、GPRS网络、EDGE网络、Wi-Fi或WiMax网络以及BlueboothTM网络的通信子系统224。
音频子系统226可以与扬声器228以及麦克风230相耦合，以便帮助实施启用语音的功能，例如语音识别、语音复制、数字记录和电话功能。I/O子系统240可以包括触摸屏控制器242和/或一个或多个其他输入控制器244。触摸屏控制器242可以耦合到触摸屏246。举例来说，该触摸屏246和触摸屏控制器242可以使用多种触摸感测技术中的任何一种来检测与之进行的接触和移动或是暂停，其中感测技术包括但不局限于电容性、电阻性、红外和表面声波技术。一个或多个其他输入控制器244可以耦合到其他输入/控制设备248，例如一个或多个按钮、摇杆开关、拇指旋轮、红外端口、USB端口、和/或指示笔之类的指点设备。所述一个或多个按钮(未显示)可以包括用于控制扬声器228和/或麦克风230音量的向上/向下按钮。
存储器接口202可以与存储器250相耦合。该存储器250可以包括高速随机存取存储器和/或非易失性存储器，例如一个或多个磁盘存储设备，一个或多个光学存储设备，和/或闪存存储器(例如NAND，NOR)。存储器250可以存储操作系统272，例如Android、iOS或是Windows Phone之类的操作系统。该操作系统272可以包括用于处理基本系统服务以及执行依赖于硬件的任务的指令。存储器250还可以存储一个或多个程序274。在移动设备运行时，会从存储器250中加载操作系统272，并且由处理器204执行。程序274在运行时，也会从存储器250中加载，并由处理器204执行。程序274运行在操作系统之上，利用操作系统以及底层硬件提供的接口实现各种用户期望的功能，如即时通信、网页浏览、图片管理等。程序274可以是独立于操作系统提供的，也可以是操作系统自带的。另外，程序274被安装到移动终端200中时，也可以向操作系统添加驱动模块。程序274可以布置为在操作系统上由一个或多个处理器204执行相关的指令。在一些实施例中，移动终端200被配置为执行根据本发明的混合应用的埋点方法。其中，移动终端200的一个或多个程序274包括用于执行根据本发明的混合应用的埋点方法的指令。
图3示出了根据本发明的一个实施例的混合应用的埋点方法300的流程图。移动终端200和网络服务器600配置为执行根据本发明的混合应用的埋点方法300时，两者通过相互之间的数据通信来共同完成混合应用的埋点方法300的处理，此时移动终端200的一个或多个程序274包括用于执行根据本发明的混合应用的埋点方法300的指令。
如图3所示，方法300始于步骤S311。在步骤S311中，对与网络服务器600通信连接的每一个移动终端，该移动终端遍历其安装的混合应用的当前页面的视图树，以查找到该视图树中的网络视图控件。根据本发明的一个实施例，网络服务器600与移动终端200通信连接，移动终端200中安装的混合应用记为A，混合应用A的当前页面记为B，则移动终端200遍历其安装的混合应用A的当前页面B的视图树，以查找到该视图树中的网络视图控件。图4示出了根据本发明的一个实施例的混合应用的当前页面的示意图，该示意图中显示的页面即为移动终端200所安装的混合应用A的当前页面B。在图4中，下方显示有“首页”、“分类”、“发现”、“购物车”和“我的”共计5个图标，这5个图标对应的控件均为原生控件，且“首页”图标对应的控件为网络视图控件，将其记为C，则移动终端200在当前页面B的视图树中查找到的网络视图控件即为网络视图控件C。
随后，进入步骤S312，移动终端200通过该混合应用的原生框架层，向该网络视图控件注入相应的JS接口和JS脚本，以实现原生框架层与网络视图控件的通信。根据本发明的一个实施例，可通过如下方式向该网络视图控件注入相应的JS接口和JS脚本，以实现原生框架层与网络视图控件的通信。首先，在当前页面B加载的过程中，向该网络视图控件注入相应的JS接口，当该网络视图控件关联页面视图中的网页页面加载完成后，向该网络视图控件注入相应的JS脚本。在该实施方式中，可通过调用WebView的addJavascript()方法来向网络视图控件C注入相应的JS接口，相关代码示例如下所示：
webView.addJavascriptInterface(CodelessViewVisitor.HybridEventVisitor.hybridEvent,\"bubble\")；
if(！Utils.isApiLevelAbove(Build.VERSION_CODES.KITKAT)){webView.addJavascriptInterface(CodelessViewSnapshot.callback,\"getPath\")；}
而在WebView的onPageFinished()回调方法中，调用WebView的loadUrl(\"javascript:jsStr\")即可完成JS脚本的注入，相关代码示例如下所示：
String injectJs＝\"var codelessJs＝document.createElement(\\\"script\\\")；\"；
injectJs+＝\"codelessJs.src＝\\\"file:///android_asset/js-sdk/sdk.js\\\"；\"；
injectJs+＝\"codelessJs.onload＝function(){window.talkingdata.onload(\\\"\"+str+\"\\\")}；\"；
injectJs+＝\"document.body.appendChild(codelessJs)\"；
view.loadUrl(\"javascript:\"+injectJs)；
view.loadUrl(\"javascript:window.bubble.onPageFinished()\")；
至此，完成了混合应用A中当前页面B的埋点处理的初始化工作。
接下来，在步骤S313中，移动终端200响应截图指令，根据该网络视图控件，获取当前页面的页面截图及页面控件信息。根据本发明的一个实施例，混合应用的埋点系统100还包括计算设备(图1中未示出)，该计算设备与网络服务器600通信连接，可通过网络服务器600向移动终端200下发相应的指令。当移动终端200中混合应用A的原生框架层与网络视图控件已经可以进行数据通信后，一方面该计算设备可向网络服务器600发出截图指令，以指示网络服务器600将该截图指令发送给移动终端200，另一方面移动终端200也可以自行生成截图指令以便触发响应，即对于截图指令的产生和来源，本发明并不进行限制。
根据本发明的一个实施例，可通过如下方式获取当前页面的页面截图及页面控件信息。首先，获取当前页面中视图树的根控件，再调用根控件对应的截屏函数对当前页面进行屏幕截图，以获取当前页面的页面截图。具体的，先调用该根控件对应的截屏函数对当前页面进行屏幕截图以获取屏幕图片，并将该屏幕图片保存为Bitmap类型对象，然后根据从屏幕图片的Bitmap类型对象中获取的图片缩放比例重新调整屏幕图片的宽高，以获取当前页面的页面截图。在该实施方式中，首先，获取混合应用A中当前页面B的Activity组件，通过该Activity组件来调用mActivity.getWindow().getDecorView().get RootView()函数来获取当前页面B中视图树的根控件，并获取当前屏幕的大小，通过反射调用该根控件对应的截屏函数createSnapshot()方法对当前页面B进行屏幕截图，以获取当前整体屏幕内容对应的屏幕图片，将该屏幕图片保存为Bitmap类型对象。如果通过上述方法没有获取到屏幕图片，则调用根控件的getDrawingCache()方法来进行获取。在得到屏幕图片的Bitmap类型对象后，从中获取屏幕密度Density，根据Density计算出当前屏幕图片的图片缩放比例，根据该比例重新调整屏幕图片的宽高，从而获取移动终端200当前展示的整个界面的图片作为当前页面B的页面截图，该页面截图可参考图4。
在获取到当前页面的页面截图后，还需要获取当前页面的页面控件信息，而页面控件信息包括原生页面控件信息和网页页面控件信息。具体的，在获取页面控件信息时，先遍历当前页面的视图树中的所有控件，以获取各控件的控件信息作为该当前页面的原生页面控件信息，当遍历到的控件是网络视图控件时，调用该网络视图控件对应的JS方法，以获取该网络视图控件关联页面视图里的网页页面中各控件的控件信息，作为该当前页面的网页页面控件信息。在该实施方式中，通过遍历当前页面B的视图树中的所有控件，比如图4中所示的“首页”、“分类”、“发现”、“购物车”和“我的”这5个图标对应的控件，获取相应的5个控件的控件信息作为当前页面B的原生页面控件信息。当遍历到的控件是“首页”图标对应的控件C时，由于该控件为网络视图控件，则调用WebView的JS方法，即webview.evaluateJavascript(\"javascript:window.talkingdata.getConfig()\",callback)，来获取网络视图控件C关联页面视图里的网页页面中各控件的控件信息，作为当前页面B的网页页面控件信息。这里的网页页面可参考图4中“首页”、“分类”、“发现”、“购物车”和“我的”这5个图标的上方区域，在该网页页面中，如“充值缴费”、“领京豆”和“领券”等图标对应的控件即为当前页面B的网页页面控件。需要说明的是，视图树是以基于当前页面B的根控件为起始点进行子控件的查找而获取到的，在遍历视图树的过程中，会获取到每个控件的控件信息，控件信息包括控件名称、控件ID、HashCode、位置、路径、尺寸、可见性、父子关系和可点击性中的至少一种。以下为一个网页页面控件信息的示例：
\"hybrid\":
[\"{\\\"elements\\\":
[{\\\"hashCode\\\":\\\"h5_481291295\\\",\\\"height\\\":40,\\\"left\\\":0,\\\"path\\\":\\\"HTML/BODY/DIV[1]/HEADER[3]\\\",\\\"top\\\":0,\\\"type\\\":\\\"h5_element\\\",\\\"webview_id\\\":242342657,\\\"width\\\":412},
{\\\"hashCode\\\":\\\"h5_1754174918\\\",\\\"height\\\":40,\\\"left\\\":0,\\\"path\\\":\\\"HTML/BODY/DIV[1]/HEADER[3]/DIV[1]\\\",\\\"top\\\":0,\\\"type\\\":\\\"h5_element\\\",\\\"webview_id\\\":242342657,\\\"width\\\":412},
{\\\"hashCode\\\":\\\"h5_1457213103\\\",\\\"height\\\":30,\\\"left\\\":0,\\\"path\\\":\\\"HTML/BODY/DIV[1]/HEADER[3]/DIV[1]/A[1]\\\",\\\"top\\\":10,\\\"type\\\":\\\"h5_element\\\",\\\"webview_id\\\":242342657,\\\"width\\\":80},
{\\\"hashCode\\\":\\\"h5_282697174\\\",\\\"height\\\":40,\\\"left\\\":0,\\\"path\\\":\\\"HTML/BODY/DIV[1]/HEADER[3]/DIV[1]/FORM[5]\\\",\\\"top\\\":0,\\\"type\\\":\\\"h5_element\\\",\\\"webview_id\\\":242342657,\\\"width\\\":412},
{\\\"hashCode\\\":\\\"h5_1448760612\\\",\\\"height\\\":20,\\\"left\\\":90,\\\"path\\\":\\\"HTML/BODY/DIV[1]/HEADER[3]/DIV[1]/FORM[5]/SPAN[1]\\\",\\\"top\\\":10,\\\"type\\\":\\\"h5_element\\\",\\\"webview_id\\\":242342657,\\\"width\\\":20},
{\\\"hashCode\\\":\\\"h5_374397012\\\",\\\"height\\\":30,\\\"left\\\":85,\\\"path\\\":\\\"HTML/BODY/DIV[1]/HEADER[3]/DIV[1]/FORM[5]/INPUT[3]\\\",\\\"top\\\":5,\\\"type\\\":\\\"h5_element\\\",\\\"webview_id\\\":242342657,\\\"width\\\":277}}
……]
]
在步骤S314中，移动终端200通过原生框架层将页面截图及页面控件信息上报至网络服务器600。根据本发明的一个实施例，网络服务器600实现为WebSocket服务器，为了保证兼容于原有的原生框架层，需要在原生框架层和Websocket服务器的通信协议的基础上，增加“hybrid”字段，而“hybrid”字段中的内容即为步骤S313中获取到的网页页面控件信息对应的字符串。在该实施方式中，移动终端200和网络服务器600在交互的过程中采取Json格式通信，则移动终端200所上传的页面控件信息也会以Json格式来展现，其中，“objects”对象中存放的是原生页面控件信息对应的结构信息，每一个Json对象描述一个控件的控件信息，包括宽高、位置、class等属性，“hybrid”对象与“hybrid”字段对应，存放的是网页页面控件信息，以字符串表示，其中使用数组保存的是可能存在的当前页面中多个网络视图控件的控件信息。以下为Json格式下页面控件信息的一个示例：
{
\"type\":\"snapshot_response\",
\"payload\":{
\"activities\":[
{
\"activity\":\"com.tendcloud.demo.MainActivity\",
\"scale\":0.2857143,
\"serialized_objects\":{
\"rootObject\":211055123,
\"objects\":[
{
\"hashCode\":211055123,
\"id\":-1,
\"id_name\":null,
\"contentDescription\":null,
\"tag\":null,
\"top\":0,
……
\"translationY\":0,
\"classes\":[
\"com.android.internal.policy.PhoneWindow.DecorView\",
\"android.widget.FrameLayout\",
\"android.view.ViewGroup\",
\"android.view.View\"],
\"importantForAccessibility\":true,
\"clickable\":false,
\"alpha\":1,
\"hidden\":0,
……
}
],
\"hybrid\":[
“webview_path1”,
“webview_path2”]
},
\"screenshot\":\"\",
\"image_hash\":\"01d6492a91d60f800d913d1f41c52e61\"}
],
\"snapshot_time_millis\":323}
}
在步骤S321中，网络服务器600根据接收到的、各移动终端上报的页面截图及页面控件信息，生成与各移动终端对应的控件路径配置信息。根据本发明的一个实施例，可通过如下方式来生成各移动终端对应的控件路径配置信息。具体的，对每一个移动终端，网络服务器600根据该移动终端上报的页面截图及页面控件信息，响应相应的埋点指令，对该页面控件信息所包括的原生页面控件信息和网页页面控件信息所对应的控件中、待埋点的控件添加触发事件，再根据添加有触发事件的各控件的控件信息，生成与该移动终端对应的控件路径配置信息。
考虑到网络服务器600一般是与多个移动终端通信连接，为便于理解和描述，此处以接收到多个移动终端中任一个移动终端上报的页面截图及页面控件信息为例，进行后续处理的说明。在该实施方式中，网络服务器600接收到移动终端200上报的页面截图及页面控件信息，将该页面截图和页面控件信息下发至计算设备，以便该计算设备将当前页面渲染出来向用户展示。此时，用户可在计算设备的当前界面中查看到所有可进行埋点的控件，包括原生页面控件信息对应的控件和网页页面控件信息对应的控件。用户可使用可视化工具进行控件选定，选定的控件即为待埋点的控件，点击全部生效后，计算设备会向网络服务器600发送相应的埋点指令，网络服务器600则会根据移动终端200上报的页面截图及页面控件信息，响应该埋点指令，对该页面控件信息所包括的原生页面控件信息和网页页面控件信息所对应的控件中、待埋点的控件添加触发事件，然后根据添加有触发事件的各控件的控件信息，生成与移动终端200对应的控件路径配置信息。
进而，网络服务器600执行步骤S322，将各控件路径配置信息发送至对应的移动终端。根据本发明的一个实施例，网络服务器600将步骤S321中生成的控件路径配置信息发送至移动终端200。
最后，在步骤S315中，各移动终端接收网络服务器600下发的、与其对应的控件路径配置信息，解析控件路径配置信息并映射到相应的控件上，以完成埋点。其中，控件路径配置信息包括原生页面控件路径配置信息和网页页面控件路径配置信息，原生页面控件路径配置信息为根据原生页面控件信息所对应的控件中、添加有触发事件的各控件的控件信息生成的，网页页面控件路径配置信息为根据网页页面控件信息所对应的控件中、添加有触发事件的各控件的控件信息生成的。根据本发明的一个实施例，可通过如下方式解析控件路径配置信息并映射到相应的控件上，以完成埋点。首先，解析原生页面控件路径配置信息，以获取当前页面中网络视图控件的路径信息，并根据该路径信息查找到网络视图控件，然后解析网页页面控件路径配置信息，以获取网络视图控件关联页面视图里的网页页面中相应控件的路径信息，再调用该网络视图控件对应的URL加载方法，将该网页页面中相应控件的路径信息传递至JS接口，以实现埋点。
在该实施方式中，移动终端200解析原生页面控件路径配置信息，以获取当前页面B中网络视图控件C的路径信息，并根据该路径信息查找到网络视图控件C，然后解析网页页面控件路径配置信息，以获取网络视图控件C关联页面视图里的网页页面中相应控件的路径信息，再调用该网络视图控件C对应的URL加载方法，即webview.loadUrl(\"javascript:window.talkingdata.set Config(pathstr)\")，将该网页页面中相应控件的路径信息传递至JS接口，利用JS接口对这一路径信息进行解析并映射到选定的待埋点控件上，简单来说就是在找到选定的待埋点控件后，比如找到图4中“充值缴费”图标对应的控件之后，先修改该控件的AccessibilityDelegate对象，在回调方法中添加相应的埋点事件，使该控件在当前页面B中所显示的图标每次触发点击事件的同时也会触发一次埋点事件，从而完成了埋点操作。
图5示出了根据本发明的又一个实施例的混合应用的埋点方法500的流程图。当移动终端200被配置为执行混合应用的埋点方法500时，移动终端200的一个或多个程序274包括用于执行根据本发明的混合应用的埋点方法500的指令。在该实施方式中，移动终端200中安装有混合应用，且与网络服务器600通信连接。
如图5所示，方法500始于步骤S510。在步骤S510中，遍历混合应用的当前页面的视图树，以查找到该视图树中的网络视图控件。步骤S510中的具体处理过程，可参照方法300中步骤S311的相关内容，此处不予以赘述。
随后，进入步骤S520，通过该混合应用的原生框架层，向该网络视图控件注入相应的JS接口和JS脚本，以实现原生框架层与网络视图控件的通信。根据本发明的一个实施例，可通过如下方式向该网络视图控件注入相应的JS接口和JS脚本。首先，在当前页面加载的过程中，向该网络视图控件注入相应的JS接口，然后，当该网络视图控件关联页面视图中的网页页面加载完成后，向该网络视图控件注入相应的JS脚本。步骤S520中的具体处理过程，可参照方法300中步骤S312的相关内容，此处不予以赘述。
在步骤S530中，响应截图指令，根据该网络视图控件，获取当前页面的页面截图及页面控件信息。根据本发明的一个实施例，可通过如下方式获取当前页面的页面截图及页面控件信息。首先，获取当前页面中视图树的根控件，再调用根控件对应的截屏函数对当前页面进行屏幕截图，以获取当前页面的页面截图。具体的，先调用该根控件对应的截屏函数对当前页面进行屏幕截图以获取屏幕图片，并将该屏幕图片保存为Bitmap类型对象，然后根据从屏幕图片的Bitmap类型对象中获取的图片缩放比例重新调整屏幕图片的宽高，以获取当前页面的页面截图。在获取到当前页面的页面截图后，还需要获取当前页面的页面控件信息，而页面控件信息包括原生页面控件信息和网页页面控件信息。进一步的，在获取页面控件信息时，先遍历当前页面的视图树中的所有控件，以获取各控件的控件信息作为该当前页面的原生页面控件信息，当遍历到的控件是网络视图控件时，调用该网络视图控件对应的JS方法，以获取该网络视图控件关联页面视图里的网页页面中各控件的控件信息，作为该当前页面的网页页面控件信息。步骤S530中的具体处理过程，可参照方法300中步骤S313的相关内容，此处不予以赘述。
在步骤S540中，通过原生框架层将页面截图及页面控件信息上报至网络服务器600，以指示网络服务器600生成控件路径配置信息。步骤S540中的具体处理过程，可参照方法300中步骤S314的相关内容，此处不予以赘述。
最后，执行步骤S550，接收网络服务器600下发的控件路径配置信息，解析该控件路径配置信息并映射到相应的控件上，以完成埋点。根据本发明的一个实施例，控件路径配置信息包括原生页面控件路径配置信息和网页页面控件路径配置信息，则可通过如下方式解析该控件路径配置信息并映射到相应的控件上，以完成埋点的步骤。在该实施方式中，先解析原生页面控件路径配置信息，以获取当前页面中网络视图控件的路径信息，并根据该路径信息查找到该网络视图控件，再解析网页页面控件路径配置信息，以获取该网络视图控件关联页面视图里的网页页面中相应控件的路径信息，进而调用该网络视图控件对应的URL加载方法，将该网页页面中相应控件的路径信息传递至JS接口，以实现埋点。步骤S550中的具体处理过程，可参照方法300中步骤S315的相关内容，此处不予以赘述。
现有的混合应用的埋点方案只能够对原生控件进行埋点，而HTML5页面是要运行在网络视图控件，即WebView控件中的，但WebView控件只是众多原生控件中的一个，当前方案仅仅能够支持到WebView控件这一层级，其内部的网页页面则是无法支持到埋点的。根据本发明实施例的混合应用的埋点技术方案，首先在移动终端中查找到混合应用的当前页面的网络视图控件，通过注入JS接口和JS脚本来建立原生框架层与网络视图控件的通信，之后根据网络视图控件获取当前页面的页面截图及页面控件信息，通过原生框架层将页面截图及页面控件信息上报至网络服务器，以便网络服务器生成相应的控件路径配置信息，在移动终端接收到网络服务器下发的控件路径配置信息后，对其进行解析并映射到相应的控件上，以完成埋点。在上述技术方案中，原生框架层与网络视图控件之间的通信桥梁搭建后，借助原生框架层可将混合应用中当前页面的页面控件信息与页面截图上报网络服务器。而对网络服务器而言，其响应相应的埋点指令对各待埋点的控件添加触发事件，以生成控件路径配置信息。最后，移动终端根据该控件路径配置信息先查找到网络视图控件，再将该网络视图控件关联页面视图里的网页页面中相应控件的路径信息传递至JS接口，以实现混合应用的可视化埋点，无需对混合应用中大量的网页页面进行统计埋点，节约了人力资源和时间。
B10.如B9所述的方法，所述向所述网络视图控件注入相应的JS接口和JS脚本的步骤包括：
在所述当前页面加载的过程中，向所述网络视图控件注入相应的JS接口；
当所述网络视图控件关联页面视图中的网页页面加载完成后，向所述网络视图控件注入相应的JS脚本。
B11.如B9或10所述的方法，所述根据所述网络视图控件，获取当前页面的页面截图及页面控件信息的步骤包括：
获取当前页面中视图树的根控件；
调用所述根控件对应的截屏函数对当前页面进行屏幕截图，以获取当前页面的页面截图。
B12.如B11所述的方法，所述调用所述根控件对应的截屏函数对当前页面进行屏幕截图，以获取当前页面的页面截图的步骤包括：
调用所述根控件对应的截屏函数对当前页面进行屏幕截图以获取屏幕图片，并将所述屏幕图片保存为Bitmap类型对象；
根据从屏幕图片的Bitmap类型对象中获取的图片缩放比例重新调整屏幕图片的宽高，以获取当前页面的页面截图。
B13.如B9-12中任一项所述的方法，所述页面控件信息包括原生页面控件信息和网页页面控件信息，所述根据所述网络视图控件，获取当前页面的页面截图及页面控件信息的步骤包括：
遍历当前页面的视图树中的所有控件，以获取各控件的控件信息作为该当前页面的原生页面控件信息；
当遍历到的控件是网络视图控件时，调用所述网络视图控件对应的JS方法，以获取所述网络视图控件关联页面视图里的网页页面中各控件的控件信息，作为该当前页面的网页页面控件信息。
B14.如B9-13中任一项所述的方法，所述页面控件信息包括原生页面控件信息和网页页面控件信息，所述网络服务器根据接收到的、各移动终端上报的页面截图及页面控件信息，生成与各移动终端对应的控件路径配置信息的步骤包括：
对每一个移动终端，网络服务器根据该移动终端上报的页面截图及页面控件信息，响应相应的埋点指令，对该页面控件信息所包括的原生页面控件信息和网页页面控件信息所对应的控件中、待埋点的控件添加触发事件；
根据添加有触发事件的各控件的控件信息，生成与该移动终端对应的控件路径配置信息。
B15.如B9-15中任一项所述的方法，所述控件路径配置信息包括原生页面控件路径配置信息和网页页面控件路径配置信息，所述解析所述控件路径配置信息并映射到相应的控件上，以完成埋点的步骤包括：
解析所述原生页面控件路径配置信息，以获取当前页面中网络视图控件的路径信息，并根据该路径信息查找到所述网络视图控件；
解析所述网页页面控件路径配置信息，以获取所述网络视图控件关联页面视图里的网页页面中相应控件的路径信息；
调用所述网络视图控件对应的URL加载方法，将所述网页页面中相应控件的路径信息传递至所述JS接口，以实现埋点。
在此处所提供的说明书中，说明了大量具体细节。然而，能够理解，本发明的实施例可以在没有这些具体细节的情况下被实践。在一些实例中，并未详细示出公知的方法、结构和技术，以便不模糊对本说明书的理解。
类似地，应当理解，为了精简本公开并帮助理解各个发明方面中的一个或多个，在上面对本发明的示例性实施例的描述中，本发明的各个特征有时被一起分组到单个实施例、图、或者对其的描述中。然而，并不应将该公开的方法解释成反映如下意图：即所要求保护的本发明要求比在每个权利要求中所明确记载的特征更多特征。更确切地说，如下面的权利要求书所反映的那样，发明方面在于少于前面公开的单个实施例的所有特征。因此，遵循具体实施方式的权利要求书由此明确地并入该具体实施方式，其中每个权利要求本身都作为本发明的单独实施例。
本领域那些技术人员应当理解在本文所公开的示例中的设备的模块或单元或组间可以布置在如该实施例中所描述的设备中，或者可替换地可以定位在与该示例中的设备不同的一个或多个设备中。前述示例中的模块可以组合为一个模块或者此外可以分成多个子模块。
本领域那些技术人员可以理解，可以对实施例中的设备中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个设备中。可以把实施例中的模块或单元或组间组合成一个模块或单元或组间，以及此外可以把它们分成多个子模块或子单元或子组间。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外，可以采用任何组合对本说明书(包括伴随的权利要求、摘要和附图)中公开的所有特征以及如此公开的任何方法或者设备的所有过程或单元进行组合。除非另外明确陈述，本说明书(包括伴随的权利要求、摘要和附图)中公开的每个特征可以由提供相同、等同或相似目的的替代特征来代替。
此外，本领域的技术人员能够理解，尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征，但是不同实施例的特征的组合意味着处于本发明的范围之内并且形成不同的实施例。例如，在下面的权利要求书中，所要求保护的实施例的任意之一都可以以任意的组合方式来使用。
此外，所述实施例中的一些在此被描述成可以由计算机系统的处理器或者由执行所述功能的其它装置实施的方法或方法元素的组合。因此，具有用于实施所述方法或方法元素的必要指令的处理器形成用于实施该方法或方法元素的装置。此外，装置实施例的在此所述的元素是如下装置的例子：该装置用于实施由为了实施该发明的目的的元素所执行的功能。
这里描述的各种技术可结合硬件或软件，或者它们的组合一起实现。从而，本发明的方法和设备，或者本发明的方法和设备的某些方面或部分可采取嵌入有形媒介，例如软盘、CD-ROM、硬盘驱动器或者其它任意机器可读的存储介质中的程序代码(即指令)的形式，其中当程序被载入诸如计算机之类的机器，并被所述机器执行时，所述机器变成实践本发明的设备。
在程序代码在可编程计算机上执行的情况下，计算设备一般包括处理器、处理器可读的存储介质(包括易失性和非易失性存储器和/或存储元件)，至少一个输入装置，和至少一个输出装置。其中，存储器被配置用于存储程序代码；处理器被配置用于根据该存储器中存储的所述程序代码中的指令，执行本发明的混合应用的埋点方法。
以示例而非限制的方式，计算机可读介质包括计算机存储介质和通信介质。计算机可读介质包括计算机存储介质和通信介质。计算机存储介质存储诸如计算机可读指令、数据结构、程序模块或其它数据等信息。通信介质一般以诸如载波或其它传输机制等已调制数据信号来体现计算机可读指令、数据结构、程序模块或其它数据，并且包括任何信息传递介质。以上的任一种的组合也包括在计算机可读介质的范围之内。
如在此所使用的那样，除非另行规定，使用序数词“第一”、“第二”、“第三”等等来描述普通对象仅仅表示涉及类似对象的不同实例，并且并不意图暗示这样被描述的对象必须具有时间上、空间上、排序方面或者以任意其它方式的给定顺序。
尽管根据有限数量的实施例描述了本发明，但是受益于上面的描述，本技术领域内的技术人员明白，在由此描述的本发明的范围内，可以设想其它实施例。此外，应当注意，本说明书中使用的语言主要是为了可读性和教导的目的而选择的，而不是为了解释或者限定本发明的主题而选择的。因此，在不偏离所附权利要求书的范围和精神的情况下，对于本技术领域的普通技术人员来说许多修改和变更都是显而易见的。对于本发明的范围，对本发明所做的公开是说明性的，而非限制性的，本发明的范围由所附权利要求书限定。