CN112905433B - 轨迹追踪方法、装置、电子设备和可读存储介质 - Google Patents

Abstract

本发明的实施例提供了一种轨迹追踪方法、装置、电子设备和可读存储介质，涉及计算机技术领域。本发明实施例提供的轨迹追踪方法、装置、电子设备和可读存储介质，在监听到任务事件的情况下，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据，将行为轨迹数据与各绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧，将各关键帧进行合成处理，得到包括行为轨迹数据的可视化载体，实现了SANPSHOT功能，并且可对用户产生的行为数据进行追踪以及可视化呈现。

Description

轨迹追踪方法、装置、电子设备和可读存储介质

技术领域

本发明涉及计算机技术领域，具体而言，涉及一种轨迹追踪方法、装置、电子设备和可读存储介质。

背景技术

随着互联网技术的飞速发展和浏览器能力的日趋强大，网页应用(WEB应用)的数量越来越多。无论是生产还是生活，每个应用的快照技术(SNAPSHOT)都扮演着很重要的角色，它能够迅速分享信息，或者复现场景。

但是对于浏览器而言，浏览器本身不提供SANPSHOT功能，通常是通过系统或者插件来实现SANPSHOT功能，但是这个过程会丢失用户在页面内的行为信息，进而也就无法对用户产生的行为信息进行追踪及复现。

发明内容

基于上述研究，本发明提供了一种轨迹追踪方法、装置、电子设备和可读存储介质，以改善上述问题。

本发明的实施例可以这样实现：

第一方面，本发明提供一种轨迹追踪方法，所述方法包括：

在监听到任务事件的情况下，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据；

将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧；

将各所述关键帧进行合成处理，得到包括所述行为轨迹数据的可视化载体。

在可选的实施方式中，所述行为轨迹数据包括至少一个行为操作、每个所述行为操作对应的时间点以及在该时间点的关键信息；所述将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧的步骤包括：

将每个所述行为操作对应的时间点与各所述绘制帧的时间点进行匹配，得到时间点相同的行为操作以及绘制帧；

针对时间点相同的行为操作以及绘制帧，在该绘制帧上绘制与该行为操作相同的行为轨迹以及在该绘制帧上写入在该行为操作对应的时间点的关键信息，得到包括轨迹数据的关键帧；其中，所述关键信息包括设备信息、时间信息以及用户信息。

在可选的实施方式中，在将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理之前，所述方法还包括：

根据预设类别标签，对所述行为轨迹数据进行聚类，得到不同类别的行为轨迹数据；

所述将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理的步骤包括：

将不同类别的行为轨迹数据与各所述绘制帧进行匹配以及绘制处理。

在可选的实施方式中，所述将各所述关键帧进行合成处理，得到包括所述行为轨迹数据的可视化载体的步骤包括：

根据各所述关键帧的时间点，按照时间顺序将各所述关键帧进行合成，得到包括所述行为轨迹数据的可视化载体。

在可选的实施方式中，所述调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据的步骤包括：

通过第一worker记录网页的多个绘制帧以及通过第二worker记录用户浏览网页的行为轨迹数据。

在可选的实施方式中，所述方法还包括：

在执行每个预先设定的触发动作时，对所述触发动作进行标识，得到多个动作标识；

在得到包括轨迹数据的可视化载体之后，所述方法还包括：

将所述可视化载体写入到存储介质，并生成携带所述动作标识的回调事件。

在可选的实施方式中，所述方法还包括：

根据预先设定的清理条件，对所述存储介质中的可视化载体进行删除。

第二方面，本发明提供一种轨迹追踪装置，所述轨迹追踪装置包括数据记录模块、数据处理模块以及数据合成模块；

所述数据记录模块用于在监听到任务事件后的情况下，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据；

所述数据处理模块用于将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧；

所述数据合成模块用于将各所述关键帧进行合成处理，得到包括所述行为轨迹数据的可视化载体。

第三方面，本发明提供一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现前述实施方式任意一项所述的轨迹追踪方法。

第四方面，本发明提供一种可读存储介质，所述可读存储介质中存储有计算机程序，所述计算机程序被执行时实现前述实施方式任意一项所述的轨迹追踪方法。

本发明实施例提供的轨迹追踪方法、装置、电子设备和可读存储介质，在监听到任务事件的情况下，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据，将行为轨迹数据与各绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧，将各关键帧进行合成处理，得到包括行为轨迹数据的可视化载体，实现了SANPSHOT功能，并且可对用户产生的行为数据进行追踪以及可视化呈现，实现场景的复现。

附图说明

为了更清楚地说明本发明实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本发明的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。

图1为本发明实施例所提供的电子设备的一种方框示意图。

图2为本发明实施例所提供的轨迹追踪方法的一种流程示意图。

图3为本发明实施例所提供的轨迹追踪方法的另一种流程示意图。

图4为本发明实施例所提供的轨迹追踪装置的一种方框示意图。

图标：100-电子设备；10-轨迹追踪装置；11-数据记录模块；12-数据处理模块；13-数据合成模块；20-存储器；30-处理器；40-通信单元。

具体实施方式

为使本发明实施例的目的、技术方案和优点更加清楚，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本发明实施例的组件可以以各种不同的配置来布置和设计。

因此，以下对在附图中提供的本发明的实施例的详细描述并非旨在限制要求保护的本发明的范围，而是仅仅表示本发明的选定实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。

在本发明的描述中，需要说明的是，若出现术语“上”、“下”、“内”、“外”等指示的方位或位置关系为基于附图所示的方位或位置关系，或者是该发明产品使用时惯常摆放的方位或位置关系，仅是为了便于描述本发明和简化描述，而不是指示或暗示所指的装置或元件必须具有特定的方位、以特定的方位构造和操作，因此不能理解为对本发明的限制。

此外，若出现术语“第一”、“第二”等仅用于区分描述，而不能理解为指示或暗示相对重要性。

需要说明的是，在不冲突的情况下，本发明的实施例中的特征可以相互结合。

如背景技术所述，随着互联网技术的飞速发展和浏览器能力的日趋强大，WEB应用的数量越来越多。无论是生产还是生活，每个应用的SNAPSHOT都扮演着很重要的角色，它能够迅速分享信息，或者复现场景。但是对于浏览器而言，浏览器本身不提供SANPSHOT功能，通常通过系统或者插件来解决，但是这个过程就会丢失用户页面内的一些行为信息，进而也就无法对用户产生的行为信息进行追踪，并进行可视化呈现。并且，通过系统或者插件来实现SANPSHOT功能时，也无法携带一些关键信息，如时间戳、硬件规格等信息，不利于开发者进行数据分析、问题定位等等。

基于此，本发明实施例提供一种轨迹追踪方法、装置、电子设备和可读存储介质，利用浏览器自身Service Worker的计算能力，捕获运行时的绘制帧以及用户的行为轨迹，通过渲染引擎对行为轨迹数据与各绘制帧进行匹配以及绘制处理，并重新进行组合，得到包括行为轨迹数据的可视化载体，实现了SANPSHOT功能，并且可对用户产生的行为数据进行追踪以及可视化呈现，实现场景的复现。

本实施例所提供的轨迹追踪方法，可以应用于手机、平板电脑、笔记本电脑、超级移动个人计算机(ultra-mobile personal computer，UMPC)、上网本、个人数字助理(personal digital assistant，PDA)等电子设备上，本实施例对电子设备的具体类型不作任何限制。

请参阅图1，本实施例所提供的电子设备100可以包括轨迹追踪装置10、存储器20、处理器30以及通信单元40。

所述存储器20、处理器30以及通信单元40相互之间直接或间接地电性连接，以实现数据的传输或交互。例如，这些元件相互之间可通过一条或多条通讯总线或信号线实现电性连接。存储器20中存储有轨迹追踪装置10，所述轨迹追踪装置10包括至少一个可以软件或固件(firmware)的形式存储于所述存储器20中的软件功能模块，所述处理器30通过运行存储在存储器20内的软件程序以及模块(如本发明实施例中的轨迹追踪装置10)，从而执行各种功能应用以及数据处理，即实现本发明实施例中的轨迹追踪方法。

其中，所述存储器20可以是，但不限于，随机存取存储器(Random Access Memory，RAM)，只读存储器(Read Only Memory，ROM)，可编程只读存储器(Programmable Read-OnlyMemory，PROM)，可擦除只读存储器(Erasable Programmable Read-Only Memory，EPROM)，电可擦除只读存储器(Electric Erasable Programmable Read-Only Memory，EEPROM)等。其中，存储器20用于存储程序，所述处理器30在接收到执行指令后，执行所述程序。

所述处理器30可能是一种集成电路芯片，具有数据的处理能力。上述的处理器可以是通用处理器，包括中央处理器(Central Processing Unit，CPU)、网络处理器(NetworkProcessor，NP)等，可以实现或者执行本发明实施例中公开的各方法、步骤及逻辑框图。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

通信单元40用于通过网络建立电子设备100与其他设备(如网页服务端)之间的通信连接，实现数据的收发操作。

例如，所述电子设备100可以通过网络从服务端下载安装所需要的客户端，例如浏览器(IE浏览器、UC浏览器、360浏览器及QQ浏览器等)或其它各种应用程序。所述电子设备100上安装的客户端可直接与所述服务端进行数据通信和交互。

所述网络可以是，但不限于，有线网络或无线网络。所述电子设备100的操作系统可以是，但不限于，安卓(Android)系统、IOS(iPhone operating system)系统、Windowsphone系统、Windows系统等。

可以理解，图1所示的结构仅为示意，电子设备100还可包括比图1中所示更多或者更少的组件，或者具有与图1所示不同的配置。图1中所示的各组件可以采用硬件、软件或其组合实现。

基于图1的实现架构，请结合参考图2，图2为本实施例所提供的轨迹追踪方法的流程示意图，该方法由图1所示的电子设备100执行，运行于电子设备100的浏览器。下面对图2所示的流程示意图进行详细阐述。

步骤S10：在监听到任务事件的情况下，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据。

步骤S20：将行为轨迹数据与各绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧。

步骤S30：将各关键帧进行合成处理，得到包括行为轨迹数据的可视化载体。

其中，电子设备中设置有用于监听的监听进程，电子设备通过该监听进程监听服务端下发的任务。当电子设备监听到服务端下发的任务事件(如追踪行为轨迹的任务)后，即可进行就绪检查，并在检查无误后，开始执行任务事件。

首先，调用浏览器自身的Service Worker，来记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据，然后将行为轨迹数据与各绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧，之后将各关键帧重新进行合成处理，即可得到包括为轨迹数据的可视化载体。

其中，可视化载体可以是由多帧图像组成的视频、动态图片，也可以是由多个图片组成，而WEB SANPSHOT的输出也是帧图片，因此，在得到包括行为轨迹数据的可视化载体后，也就实现了WEB SANPSHOT功能。

本实施例所提供的轨迹追踪方法在监听到任务事件的情况下，调用ServiceWorker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据，将行为轨迹数据与各绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧，将各关键帧进行合成处理，得到包括行为轨迹数据的可视化载体，实现了SANPSHOT功能，达到了对浏览器端功能的补全的目的，并且可对用户产生的行为数据进行追踪以及可视化呈现，便于用户对关键场景进行复现。

本实施例所提供的轨迹追踪方法，通过调用Service Worker，依靠其算力和事件驱动能力解决了浏览器本身算力不足的问题。为了便于记录数据，在本实施例中，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据的步骤包括：

通过第一worker记录网页的多个绘制帧以及通过第二worker记录用户浏览网页的行为轨迹数据。

其中，在调用Service Worker时，会启动两个进程进行记录，即第一worker和第二worker，两个worker独立执行，互不干扰。其中，第一worker记录网页的多个绘制帧，第二worker记录用户浏览网页的行为轨迹数据。如果第一worker和第二worker在记录数据的过程中发生错误，例如，无法捕捉到用户的行为轨迹数据，又例如无法记录到网页的绘制帧数据，则直接抛出异常，终止任务处理，并向用户发送异常提示信息，以使用户尽快解决问题。

如果第一worker和第二worker在记录数据的过程中未发生错误，则可以在接收到结束任务的指令后，停止第一worker和第二worker，并返回第一worker记录到的网页的绘制帧以及第二worker记录到的用户浏览网页的行为轨迹数据。

在可选的实施方式中，结束任务的指令可以是预先设定的指令，当第一worker和第二worker触发该指令时，即可结束处理。结束任务的指令还可以是由服务端发送的指令，当第一worker和第二worker接收到服务端发送的结束任务的指令后，即可结束处理。

在一种实施方式中，第一worker可以每间隔设定的时间段对网页的页面数据进行读取，从而记录得到网页的多个绘制帧。例如，可以每间隔1s读取网页的页面数据，若此时时间为9：00，则在此时读取网页当前的页面数据，得到绘制帧a1，然后在9:01s时，读取9:01这个时间点网页的页面数据，得到绘制帧a2，在9:02s时，读取9:02这个时间点网页的页面数据，得到绘制帧a3，以此类推，直至接收到结束任务的指令，停止读取。

在本实施例中，用户行为轨迹信息包括至少一个行为操作、每个行为操作对应的时间点以及在该时间点的关键信息，其中，关键信息包括设备信息、时间信息以及用户信息。设备信息包括系统内核、浏览器版本、路由信息，页面位置等，用户信息包括用户ID、序列号等唯一标识信息，时间信息可以是时间戳。

在一种实施方式中，第二worker可以在检测到用户的行为操作后，记录用户的行为操作、记录行为操作对应的时间点以及在该时间点的关键信息。例如，用户在某个时间点，点击网页的某个位置，则对该点击操作进行记录，包括点击行为以及点击的位置，同时记录该时间点以及在该时间点的关键信息，以此类推，直至接收到结束任务的指令，停止记录。

在得到用户的行为轨迹数据以及网页的绘制帧后，即可进入渲染处理，通过渲染引擎将行为轨迹数据与各绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧。

在可选的实施方式中，请结合参阅图3，将行为轨迹数据与各绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧的步骤包括步骤S21至步骤S22。

步骤S21：将每个行为操作对应的时间点与各绘制帧的时间点进行匹配，得到时间点相同的行为操作以及绘制帧；

步骤S22：针对时间点相同的行为操作以及绘制帧，在该绘制帧上绘制与该行为操作相同的行为轨迹以及在该绘制帧上写入在该行为操作对应的时间点的关键信息，得到包括轨迹数据的关键帧。

其中，每个绘制帧对应有一个时间点，因此，可根据时间信息进行匹配，进而将每个行为操作对应的时间点与各绘制帧的时间点进行匹配，得到时间点相同的行为操作以及绘制帧。

可以理解地，若某个行为操作的时间点与某个绘制帧的时间点相同，则可以表示用户在该绘制帧上进行了该行为操作，进而在得到时间点相同的行为操作以及绘制帧后，通过渲染引擎，对绘制帧重新进行绘制，即可在绘制帧上复现当时的场景。

可选的，在本实施例中，针对时间点相同的行为操作以及绘制帧，可利用Canvas的绘图能力，在该绘制帧上绘制与该行为操作相同的行为轨迹以及在该绘制帧上写入在该行为操作对应的时间点的关键信息。

例如，在a时间点时，用户的行为操作为在网页A位置上的点击，则可在a时间点的绘制帧上绘制(A位置，点击)的行为轨迹，同时在a时间点的绘制帧上写入a时间点的关键信息。又例如，在a时间点时，用户的行为操作为在网页A位置到B位置的滑动，则可在a时间点的绘制帧上绘制(A位置到B位置，滑动)的行为轨迹，同时在a时间点的绘制帧上写入a时间点的关键信息。

针对时间点相同的行为操作以及绘制帧，在该绘制帧上绘制与该行为操作相同的行为轨迹以及在该绘制帧上写入在该行为操作对应的时间点的关键信息后，即可得到包括轨迹数据的关键帧，即关键帧为包含行为轨迹以及关键信息的绘制帧。

可选的，在绘制帧上绘制行为轨迹以及写入关键信息的过程中，如果发生错误，则会终止渲染任务，并抛出异常，以向用户进行提示。

鉴于实际应用中，在某些场景下，用户经常在一段时间，在同一个位置执行相同的操作，例如，用户在网页的某个位置一直进行点击操作，而对于这些行为操作，若是一一进行匹配，则处理效率较慢。

为了便于将行为轨迹数据与各所述绘制帧进行匹配，提高处理效率，在本实施例中，在将行为轨迹数据与各绘制帧进行匹配以及绘制处理之前，方法还包括：

根据预设类别标签，对行为轨迹数据进行聚类，得到不同类别的行为轨迹数据。

相应地，将行为轨迹数据与各绘制帧进行匹配以及绘制处理的步骤包括：

将不同类别的行为轨迹数据与各绘制帧进行匹配以及绘制处理。

其中，类别标签可以根据实际需求进行设定，例如，类别标签可以是位置信息、行为操作类型中的一种，也可以是二者的组合。

在设定类别标签后，则可以将获取得到的行为轨迹数据进行聚类，从而得到不同类别的行为轨迹数据。可选的，可通过聚类算法对获取得到的行为轨迹数据进行聚类，聚类算法可以是K-Means聚类算法、K近邻算法等。需要说明的是，本实施例对聚类的手段不做具体限定，只要可根据设定的类别标签，对获取得到行为轨迹数据进行聚类即可。

在得到不同类别的行为轨迹数据后，则可以将不同类别的行为轨迹数据各所述绘制帧进行匹配处理，而在得到相匹配的绘制帧后，则绘制时则可以将同一类别的行为轨迹数据对应的绘制帧归类进行处理，以此提高绘制处理的效率。

可选的，为了进一步提高处理效率，本实施例可设定时间划分间隔，根据设定的时间划分间隔对行为轨迹数据进行划分，得到不同时间段内的行为轨迹数据，然后将不同时间段内的行为轨迹数据再根据预设类别标签进行聚类，从而得到不同时间段内不同类别的行为轨迹数据。在得到不同时间段内不同类别的行为轨迹数据后，则将不同时间段内不同类别的行为轨迹数据与对应时间段内的绘制帧进行匹配以及绘制处理，从而得到关键帧。

例如，按照设定的时间划分间隔对行为轨迹数据进行划分，得到时间段a的行为轨迹数据，时间段b的行为轨迹数据以及时间段c的行为轨迹数据，然后根据预设的类别标签，分别对时间段a的行为轨迹数据，时间段b的行为轨迹数据以及时间段c的行为轨迹数据进行聚类处理，得到时间段a中不同类别的行为轨迹数据，时间段b中不同类别的行为轨迹数据以及时间段c中不同类别的行为轨迹数据。之后将时间段a中不同类别的行为轨迹数据与时间段a中的绘制帧进行匹配以及绘制处理，将时间段b中不同类别的行为轨迹数据与时间段b中的绘制帧进行匹配以及绘制处理，将时间段c中不同类别的行为轨迹数据与时间段c中的绘制帧进行匹配以及绘制处理，从而得到时间段a中的关键帧，时间段b中的关键帧以及时间段c中的关键帧。

在得到关键帧后，即可将各关键帧进行合成，得到包括行为轨迹数据的可视化载体。

可选的，在本实施例中，将各关键帧进行合成处理，得到包括行为轨迹数据的可视化载体的步骤包括：

根据各关键帧的时间点，按照时间顺序将各关键帧进行合成，得到包括行为轨迹数据的可视化载体。

其中，可通过渲染引擎对各关键帧进行合成，得到包括行为轨迹数据的可视化载体。

在一种实施方式中，渲染引擎根据各关键帧的时间点，按照时间顺序对各关键帧进行合成，即可得到包括行为轨迹数据的可视化载体。

本实施例所提供的轨迹追踪方法，利用浏览器自身Service Worker的计算能力，捕获运行时的绘制帧以及用户的行为轨迹，通过渲染引擎对行为轨迹数据与各绘制帧进行匹配以及绘制处理，并重新进行组合，得到包括行为轨迹数据的可视化载体，实现了SANPSHOT功能，并且可对用户产生的行为数据进行追踪以及可视化呈现，实现关键场景的复现。例如，在网页应用发生错误时，通过轨迹的追踪，即可将用户的操作场景进行数值记录，从而进行模拟，并在本机上进行复现，便于用户分析数据，查找问题。

为了进一步辅助用户对WEB应用(浏览器)进行分析以及定位问题，在本实施例中，方法还包括：

在执行每个预先设定的触发动作时，对触发动作进行标识，得到多个动作标识。

在得到包括轨迹数据的可视化载体之后，方法还包括：

将可视化载体写入到存储介质，并生成携带动作标识的回调事件。

其中，在执行每个预先设定的触发动作时，可通过钩子函数对触发动作进行标识。在本实施例中，每个触发动作可根据实际需求进行设定，本实施例不做具体限定。例如，在执行调用Service Worker的动作时，可触发进行标识，进而采用Start Hooks进行标识，以指示任务开始执行。在接收到结束任务的指令后，可触发进行标识，进而采用BeforeCompose Hooks进行标识，以指示数据记录阶段结束，渲染阶段开启。在执行对绘制帧进行绘制的动作后，可触发进行标识，进而采用Composed Hooks进行标识，以指示关键帧已经处理完毕。在执行关键帧的合成动作后，可触发进行标识，进而采用Cached Hooks进行标识，以指示任务处理完毕。

在本实施例中，在将各关键帧进行合成处理，得到包括行为轨迹数据的可视化载体后，即表示轨迹追踪的任务处理完毕。而为了便于用户读取以及查询数据，则将可视化载体写入到存储介质进行存储。

而为了便于用户分析数据以及定位问题，在将可视化载体写入到存储介质时，即时产生携带动作标识的回调事件。

在本实施例中，回调事件同样携带有用户的行为轨迹数据，进而通过回调事件可以分析用户的交互行为以及关键信息，同时通过动作标识，提供了介入执行过程的能力，能够帮助开发者分析和定位问题，为WEB应用的维护、问题定位和新功能开发提供关键数据支撑。

在将可视化载体写入到存储介质进行存储后，为了释放浏览器压力，本实施例可在生成回调事件后，删除存储介质中的可视化载体，以此来释放浏览器。

鉴于实际应用中，如果网络通信存在问题，网络通信则会丢失数据，导致客户端感知不到回调事件已生成，进而也就不会执行清理操作，为了避免这种问题，本实施例所提供的方法还可以包括：

根据预先设定的清理条件，对存储介质中的可视化载体进行删除。

其中，清理条件可以是缓存量阈值、缓存时间阈值等。当存储介质中的可视化载体的缓存量达到了设定的缓存量阈值，则可以对存储介质中的可视化载体进行删除，又或者，当存储介质中的可视化载体的缓存时间量达到了设定的缓存时间阈值时，则可以对存储介质中的可视化载体进行删除。

本实施例所提供的轨迹追踪方法，通过预先设定清理条件，在缓存量或者缓存时间达到了阈值时，会自动对存储介质中的可视化载体进行删除，以此释放浏览器的压力。

本实施例提供的轨迹追踪方法，利用Service Worker提供的算力和事件驱动能力，对浏览器运行时的上下文轨迹进行追踪和捕获，结合Canvas的绘图能力，得到关键帧，通过渲染引擎进行合成，输出能够展示轨迹和关键信息的可视化载体，实现WEB SNAPSHOT功能，达到对浏览器端功能的补全的目标，解决了用户即时分享信息或者复现关键场景的问题。同时管理其任务的生命周期，以动作标识进行标记，即时产生能够携带行为轨迹数据以及动作标识的回调事件，能够帮助WEB应用的开发者分析和定位问题，为WEB应用的维护、问题定位和新功能开发提供关键数据支撑。

基于同一发明构思，请结合参阅图4，本实施例提供一种轨迹追踪装置10，轨迹追踪装置10包括数据记录模块11、数据处理模块12以及数据合成模块13。

数据记录模块11用于在监听到任务事件的情况下，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据。

数据处理模块12用于将行为轨迹数据与各绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧。

数据合成模块13用于将各关键帧进行合成处理，得到包括行为轨迹数据的可视化载体。

在可选的实施方式中，行为轨迹数据包括至少一个行为操作、每个行为操作对应的时间点以及在该时间点的关键信息，数据处理模块12用于：

将每个行为操作对应的时间点与各绘制帧的时间点进行匹配，得到时间点相同的行为操作以及绘制帧。

针对时间点相同的行为操作以及绘制帧，在该绘制帧上绘制与该行为操作相同的行为轨迹以及在该绘制帧上写入在该行为操作对应的时间点的关键信息，得到包括轨迹数据的关键帧；其中，关键信息包括设备信息、时间信息以及用户信息。

在将行为轨迹数据与各绘制帧进行匹配以及绘制处理之前，数据处理模块12还用于：

根据预设类别标签，对行为轨迹数据进行聚类，得到不同类别的行为轨迹数据。

数据处理模块12用于将不同类别的行为轨迹数据与各绘制帧进行匹配以及绘制处理。

在可选的实施方式中，数据记录模块11用于通过第一worker记录网页的多个绘制帧以及通过第二worker记录用户浏览网页的行为轨迹数据。

在可选的实施方式中，轨迹追踪装置10还包括动作标识模块；动作标识模块用于：在执行每个预先设定的触发动作时，对所述触发动作进行标识，得到多个动作标识。

数据处理模块12用于在得到包括轨迹数据的可视化载体之后，将可视化载体写入到存储介质，并生成携带动作标识的回调事件。

在可选的实施方式中，轨迹追踪装置10还包括数据清理模块，数据清理模块用于：根据预先设定的清理条件，对所述存储介质中的可视化载体进行删除。

所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的轨迹追踪装置10的具体过程，可以参考前述方法对应的过程，在此不再过多赘述。

在上述基础上，本实施例提供一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现前述实施方式任意一项所述的轨迹追踪方法。

在上述基础上，本实施例提供一种可读存储介质，所述可读存储介质中存储有计算机程序，所述计算机程序被执行时实现前述实施方式任意一项所述的轨迹追踪方法。

所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的电子设备和存储介质的具体过程，可以参考前述数据传输系统对应的过程，在此不再过多赘述。

综上所述，本发明实施例提供的轨迹追踪方法、装置、电子设备和可读存储介质，在监听到任务事件的情况下，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据，将行为轨迹数据与各绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧，将各关键帧进行合成处理，得到包括行为轨迹数据的可视化载体，实现了SANPSHOT功能，并且可对用户产生的行为数据进行追踪以及可视化呈现。

以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到的变化或替换，都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应以所述权利要求的保护范围为准。

Claims (9)

1.一种轨迹追踪方法，其特征在于，所述方法包括：

在监听到任务事件的情况下，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据；

将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧；

将各所述关键帧进行合成处理，得到包括所述行为轨迹数据的可视化载体；

其中，所述行为轨迹数据包括至少一个行为操作、每个所述行为操作对应的时间点以及在该时间点的关键信息；所述将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧的步骤包括：

将每个所述行为操作对应的时间点与各所述绘制帧的时间点进行匹配，得到时间点相同的行为操作以及绘制帧；

针对时间点相同的行为操作以及绘制帧，在该绘制帧上绘制与该行为操作相同的行为轨迹以及在该绘制帧上写入在该行为操作对应的时间点的关键信息，得到包括轨迹数据的关键帧；其中，所述关键信息包括设备信息、时间信息以及用户信息。

2.根据权利要求1所述的轨迹追踪方法，其特征在于，在将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理之前，所述方法还包括：

根据预设类别标签，对所述行为轨迹数据进行聚类，得到不同类别的行为轨迹数据；

所述将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理的步骤包括：

将不同类别的行为轨迹数据与各所述绘制帧进行匹配以及绘制处理。

3.根据权利要求1所述的轨迹追踪方法，其特征在于，所述将各所述关键帧进行合成处理，得到包括所述行为轨迹数据的可视化载体的步骤包括：

根据各所述关键帧的时间点，按照时间顺序将各所述关键帧进行合成，得到包括所述行为轨迹数据的可视化载体。

4.根据权利要求1所述的轨迹追踪方法，其特征在于，所述调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据的步骤包括：

通过第一worker记录网页的多个绘制帧以及通过第二worker记录用户浏览网页的行为轨迹数据。

5.根据权利要求1所述的轨迹追踪方法，其特征在于，所述方法还包括：

在执行每个预先设定的触发动作时，对所述触发动作进行标识，得到多个动作标识；

在得到包括轨迹数据的可视化载体之后，所述方法还包括：

将所述可视化载体写入到存储介质，并生成携带所述动作标识的回调事件。

6.根据权利要求5所述的轨迹追踪方法，其特征在于，所述方法还包括：

根据预先设定的清理条件，对所述存储介质中的可视化载体进行删除。

7.一种轨迹追踪装置，其特征在于，所述轨迹追踪装置包括数据记录模块、数据处理模块以及数据合成模块；

所述数据记录模块用于在监听到任务事件的情况下，调用Service Worker，记录网页的多个绘制帧以及记录用户浏览网页的行为轨迹数据；

所述数据处理模块用于将所述行为轨迹数据与各所述绘制帧进行匹配以及绘制处理，得到包括轨迹数据的至少一个关键帧；

所述数据合成模块用于将各所述关键帧进行合成处理，得到包括所述行为轨迹数据的可视化载体；

其中，所述行为轨迹数据包括至少一个行为操作、每个所述行为操作对应的时间点以及在该时间点的关键信息；所述数据处理模块具体用于：将每个所述行为操作对应的时间点与各所述绘制帧的时间点进行匹配，得到时间点相同的行为操作以及绘制帧；针对时间点相同的行为操作以及绘制帧，在该绘制帧上绘制与该行为操作相同的行为轨迹以及在该绘制帧上写入在该行为操作对应的时间点的关键信息，得到包括轨迹数据的关键帧；其中，所述关键信息包括设备信息、时间信息以及用户信息。

8.一种电子设备，其特征在于，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现权利要求1-6任意一项所述的轨迹追踪方法。

9.一种可读存储介质，其特征在于，所述可读存储介质中存储有计算机程序，所述计算机程序被执行时实现权利要求1-6任意一项所述的轨迹追踪方法。

Images