前端用户行为、异常数据采集工具
优采云 发布时间: 2020-08-09 18:47最近有同学又重新提起了后端的数据采集。想到了之前开源的数据采集插件,GitHub地址 :
adminV/dataAcquisition
因为不注重后端数据剖析,导致项目没有挺好的运行上去,但是整个项目还是很不错的,功能也比较齐全,就如此舍弃掉实在是可惜了。
于是花点时间构建了下。并做了对应的 demo。借这个机会再度向你们介绍推荐下。
一.为什么须要数据采集?
我们问几个问题:
1. 一个新的产品流程上线,如何得出该流程的转化率呢?
2. 一个按键的加入,如何得出有多少人点击?
3. AB 方案时,如何得出两种方案的转化?
日常开发中我们常常可以看见,看到后台的朋友借助日志来定位问题
4. 但是后端的生产问题怎样定位呢?
5. 用户形成的问题怎样能反馈到开发手中呢?
我们之前的项目是须要用户反馈到客服,然后通过工单来反馈到开发
但是这个流程周期比较长,且大部分用户嫌麻烦,懒得去反馈
有没有一种主动的搜集机制,来采集客户端的一些异常?
有没有一个页面行为的搜集工具,用于采集用户数据?
本篇文章就是要向你们介绍后端的主动异常数据采集工具 - dataAcquisition
二.我们可以采集哪些数据?
说到数据采集,我们要先清楚可采集的数据有什么
用户的点击数据,通过风波代理,可以采集到页面发生的所有点击风波,并获取到点击元素
2. 用户的输入操作,通过 input,focus,blur 事件来获取到输入框的内容,以及用户的操作
3. 页面的访问数据,通过记录页面 url 并上报,可以实现 PV 的数据统计,搭配 uuid 可以实现 UV 的统计
4. 页面中代码异常,通过 window.onerror 来采集代码中发生的异常
5. 页面中失败,异常的插口数据,通过代理 ajax 方法,在 error 方法执行之前上报恳求参数与结果
6. 页面性能数据,通过 performance 接口来估算 DNS 解析,TCP 链接时间,白屏时间,dom 解析历时等
有了以上的数据,我们可以复现用户的操作流程
也可以及时采集到用户端发生的异常
通过对用户行为的剖析,可以得出用户的习惯以及偏好。
从而优化产品方案,优化业务流程,做到数据驱动产品。
三.采集数据的方法有什么?
常见的数据采集方式:
1.自动埋点,通过大面积的数据采集,从数据中过滤出特定元素,这样做的缺点是数据量过大,优点是不需要在上线前订制采集方案。
2.主动埋点,通过对元素降低特定的 id 或 class 属性,使得采集工具确切的采集需要的数据,缺点的侵入了页面,优点是数据确切。
3.圈选埋点,通过点击的方法,对页面元素进行选取,比手动采集更精确,比自动埋点更方便。(未实现)
市面上具备圈选埋点的付费项目,报价基本在10W+
我们明天介绍的 dataAcquisition 可以完美的支持手动埋点与主动埋点。
圈选的功能也在开发计划中。
作为一个开源的工具,能解决眼前的问题,有哪些理由不试一下呢?
四.关于 dataAcquisition
dataAcquisition 插件在17年开发完成,迭代的时间比较短。
上线到生产后一年的时间没有出现过 bug
当然,由于场景的不同,还有好多问题没有曝露下来
目前已实现的功能点:
1.前端PV,UV数据采集上报
2.用户点击,输入行为采集上报
3.实现页面性能采集
4.实现代码异常采集
5.实现插口异常采集
五.demo示例
详细的文档就不放这儿展开了,全部都在README中有介绍。
插件提供了一个简单的demo,收录数据采集页面,数据剖析页面。大家可以先体验一下。
数据采集页面:
dataAc demo
在该页面的所有行为会被采集上报,
需要注意,采集的数据在刷新页面时,或点击上报按键时就会发送到后台
数据剖析页面:
admin demo
上报的数据会在此页面展示,在此页面你可以观察之前所有操作,以及对应异常的详尽数据
六.邀请参与
一个人的精力有限,开源项目的维护须要一些伙伴来共同努力,
目前能想到还未实现的功能点如下:
1. 圈选功能
2. 更多的引入形式
3. 更好的兼容性
...
所以在这里约请诸位参与到此开源项目的维护中。只须要Fork到自己的库房下,将功能点实现后递交PR给我即可。参加开源项目的朋友,会被纳入到项目的人员列表中。