一种WEB端数据采集方法及其系统与流程

一种web端数据采集方法及其系统
技术领域
1.本发明涉及数据采集技术领域，特别涉及一种web端数据采集方法及其系统。


背景技术：

2.web是一种基于超文本和http的、全球性的、动态交互的、跨平台的分布式图形信息系统，是建立在internet上的一种网络服务，为浏览者在internet上查找和浏览信息提供了图形化的、易于访问的直观界面，其中的文档及超级链接将internet上的信息节点组织成一个互为关联的网状结构，前端开发是创建web页面或app等前端界面呈现给用户的过程，通过html，css及javascript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互，web技术亦可应用于营销活动中的数据采集；
3.营销活动中需清楚了解产品的浏览量、访客数、页面平均停留时长、访客地域分布、页面访问路径及访问深度等信息，为此需采集用户在web前端的访问数据；为此，我们提出一种web端数据采集方法及其系统。


技术实现要素：

4.本发明的主要目的在于提供一种web端数据采集方法及其系统，以解决上述背景中提出的问题。
5.为实现上述目的，本发明采取的技术方案为：一种web端数据采集系统，包括前端部分和后端部分，所述前端部分和后端部分之间通过http通信，所述前端部分包括适配层、核心层和管理后台，所述适配层、核心层是数据采集sdk基于跨平台、跨技术栈方面的考虑使用分层设计的思想解耦抽象出的设计，所述适配层、核心层共同构成了数据采集sdk主体部分，所述前端部分除数据采集sdk外还包括查看统计数据及报表的管理后台部分，管理后台中主要查看采集到的数据，所述后端部分包括服务层和数据层两层，所述服务层为数据采集前端部分提供数据接收api服务、静态资源服务和统计报表服务，所述数据层保存数据采集sdk上报的采集数据和统计报表服务生成的各种报表。
6.优选地，所述前端部分由数据采集使用的sdk和查看统计报表的管理后台两大块组成，所述sdk部分内嵌入数据采集页面，在用户访问采集页面并且浏览器完成页面加载后采集页面将自动初始化采集脚本并在采集到数据后通过http协议将采集数据上报给后端中的数据接收api服务。
7.优选地，所述后端接收到采集页面上报的采集数据后，用户访问管理后台的统计报表页面查看所有的统计内容及其生成的相关报表和图形，包括pv、uv、设备信息、用户在各个页面的停留时长、页面访问深度、页面跳失率和用户访问路径桑基图。
8.优选地，所述前端数据采集sdk核心层部分囊括所有平台及技术栈中共用的采集逻辑而适配层根据不同平台的平台特性或不同技术栈的语言特性开发语言独立、平台独立的sdkapi供数据采集接入项目调用。
9.优选地，所述静态资源服务中存放数据采集sdk的静态资源文件，所述静态资源文
件是数据采集sdk的javascript脚本文件，所述前端部分接入了数据采集功能的页面在浏览器中加载时请求静态资源服务获取数据采集脚本，所述数据采集脚本在被浏览器加载后自动初始化并开始采集相关数据，然后调用所述数据接收api服务的接口上报采集数据，所述数据接收api服务接收前端数据采集sdk上报的采集数据，并将接收到的采集数据存入数据库中，所述统计报表服务为管理后台提供采集数据统计报表的生成。
10.一种web端数据采集方法，包括如下步骤：
11.步骤1：首先在采集网站中根据网站所属的平台和开发技术栈使用对应的数据采集sdkapi在网站的源码中嵌入数据采集脚本；
12.步骤2：访客通过浏览器访问该网站时浏览器将请求静态资源服务获取数据采集脚本并初始化数据采集功能；
13.步骤3：浏览器完成数据采集功能初始化之后开始监听浏览器中的各种事件，完成一次数据的采集和上报；
14.步骤4：在浏览器页面关闭之前一直重复此流程，直至页面关闭、会话结束数据采集sdk上报完页面关闭事件；
15.步骤5：在采集数据上报后用户访问管理后台中的数据统计报表页面查看采集数据；
16.步骤6：完成web端的数据采集。
17.优选地，所述步骤3中浏览器完成了数据采集功能初始化之后将开始监听浏览器中的各种事件，每当触发一次采集器监听的事件数据采集sdk就将执行对应的数据采集代码，然后根据条件请求数据采集api服务上报采集到的数据。
18.本发明具有如下有益效果：
19.本发明方案提出一种跨平台、跨技术栈的数据采集方法和系统，适用于移动端h5页面、小程序页面、webview和pc端浏览器页面数据的采集，针对vue、react、angular等不同技术栈可以通过插件接入。
附图说明
20.图1为本发明web端数据采集系统的架构概要图；
21.图2为本发明web端数据采集系统的b/s架构图；
22.图3为本发明web端数据采集方法的数据采集流程图；
23.图4为本发明web端数据采集方法的数据采集时序流程图。
具体实施方式
24.为使本发明实现的技术手段、创作特征、达成目的与功效易于明白了解，下面结合具体实施方式，进一步阐述本发明。
25.下面将结合本发明实施例中附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。
26.通常在此处附图中描述和示出的本发明实施例的组件可以以各种不同的配置来布置和设计。因此，以下对在附图中提供的本发明的实施例的详细描述并非旨在限制要求保护的本发明的范围，而是仅仅表示本发明的选定实施例。基于本发明的实施例，本领域技
术人员在没有做出创造性劳动的前提下所获得的所有其他实施例，都属于本发明保护的范围。
27.在下文中，可在本发明的各种实施例中使用的术语“包括”、“具有”及其同源词仅意在表示特定特征、数字、步骤、操作、元件、组件或前述项的组合，并且不应被理解为首先排除一个或更多个其它特征、数字、步骤、操作、元件、组件或前述项的组合的存在或增加一个或更多个特征、数字、步骤、操作、元件、组件或前述项的组合的可能性。
28.此外，术语“第一”、“第二”、“第三”等仅用于区分描述，而不能理解为指示或暗示相对重要性。
29.除非另有限定，否则在这里使用的所有术语(包括技术术语和科学术语)具有与本发明的各种实施例所属领域普通技术人员通常理解的含义相同的含义。所述术语(诸如在一般使用的词典中限定的术语)将被解释为具有与在相关技术领域中的语境含义相同的含义并且将不被解释为具有理想化的含义或过于正式的含义，除非在本发明的各种实施例中被清楚地限定。
30.实施例一：
31.请参照图2所示：当前方案适用于基于b/s架构的系统，b/s架构由用户在手机、平板、笔记本、台式机等终端上使用的浏览器和通过互联网连接的部署在各服务器上的后端服务两大部分组成；
32.如图1所示，一种web端数据采集系统，包括前端部分和后端部分，前端部分和后端部分之间通过http通信，前端部分包括适配层、核心层和管理后台，适配层、核心层是数据采集sdk基于跨平台、跨技术栈方面的考虑使用分层设计的思想解耦抽象出的设计，适配层、核心层共同构成了数据采集sdk主体部分，前端部分除数据采集sdk外还包括查看统计数据及报表的管理后台部分，管理后台中主要查看采集到的数据，后端部分包括服务层和数据层两层，服务层为数据采集前端部分提供数据接收api服务、静态资源服务和统计报表服务，数据层保存数据采集sdk上报的采集数据和统计报表服务生成的各种报表；
33.前端部分由数据采集使用的sdk和查看统计报表的管理后台两大块组成，sdk部分内嵌入数据采集页面，在用户访问采集页面并且浏览器完成页面加载后采集页面将自动初始化采集脚本并在采集到数据后通过http协议将采集数据上报给后端中的数据接收api服务；后端接收到采集页面上报的采集数据后，用户访问管理后台的统计报表页面查看所有的统计内容及其生成的相关报表和图形，包括pv、uv、设备信息、用户在各个页面的停留时长、页面访问深度、页面跳失率和用户访问路径桑基图；
34.前端数据采集sdk核心层部分囊括所有平台及技术栈中共用的采集逻辑而适配层根据不同平台的平台特性或不同技术栈的语言特性开发语言独立、平台独立的sdk api供数据采集接入项目调用；静态资源服务中存放数据采集sdk的静态资源文件，静态资源文件是数据采集sdk的javascript脚本文件，前端部分接入了数据采集功能的页面在浏览器中加载时请求静态资源服务获取数据采集脚本，数据采集脚本在被浏览器加载后自动初始化并开始采集相关数据，然后调用数据接收api服务的接口上报采集数据，数据接收api服务接收前端数据采集sdk上报的采集数据，并将接收到的采集数据存入数据库中，统计报表服务为管理后台提供采集数据统计报表的生成。
35.实施例二：
36.请参照图3-4所示：一种web端数据采集方法，首先在采集网站中根据网站所属的平台和开发技术栈使用对应的数据采集sdk api在网站的源码中嵌入数据采集脚本，当访客通过浏览器访问该网站时浏览器将请求静态资源服务获取数据采集脚本并初始化数据采集功能；
37.在浏览器完成了数据采集功能初始化之后将开始监听浏览器中的各种事件，每当触发一次采集器监听的事件数据采集sdk就将执行对应的数据采集代码然后根据条件请求数据采集api服务上报采集到的数据；至此遍完成了一次数据的采集和上报，在浏览器页面关闭之前将一直重复此流程，直至页面关闭、会话结束数据采集sdk上报完页面关闭事件；此外在采集数据上报后用户便可访问管理后台中的数据统计报表页面查看采集数据；
38.本方案适用于移动端h5页面、小程序页面、webview和pc端浏览器页面数据的采集，针对vue、react、angular等不同技术栈可以通过插件接入。
39.以上显示和描述了本发明的基本原理和主要特征和本发明的优点。本行业的技术人员应该了解，本发明不受上述实施例的限制，上述实施例和说明书中描述的只是说明本发明的原理，在不脱离本发明精神和范围的前提下，本发明还会有各种变化和改进，这些变化和改进都落入要求保护的本发明范围内。本发明要求保护范围由所附的权利要求书及其等效物界定。