Advertisement

小程序曝光之数据埋点

阅读量:

需求:

以下是对此需求的技术方案及实现思路:

2.那先看流程图:

在这里插入图片描述

3.具体的实现思路。
1)先从服务端获取 json 数据,部分代码:

在这里插入图片描述

(1)若服务端返回的数据无误,则直接更新本地存储;否则:
若服务端返回的数据存在异常,则先检查本地存储是否有对应的数据;
若本地存储为空,则可直接使用当前页面提供的trackjson数据。

在这里插入图片描述

2 获取到服务端的数据json 数据之后,进行一些初始化设置,部分代码。

在这里插入图片描述

由于小程序采用了专门的wx.createIntersectionObserver来进行监控。因此,在满足JSON需求时,应将相关组件与相应的class进行绑定,并处理相应的监听回调函数。

在这里插入图片描述

下面说具体的实现:

首先描述第一个情景:当用户在其所在的微页面区域进行无点击操作,并未执行长按屏幕操作。仅限于其正在当前展示的微页面区域内的正常滑动浏览情形下,在某个组件从屏幕上离开后(即其不再位于屏幕上),此时需评估该组件从离开屏幕至重新进入系统的时间段与离开时间的关系。若该时间差超过我们设定的数据采集阈值,则执行上传至神策系统的流程。

为了演示功能特点,在本例中采用goodsList组件搭建一个简单的展示场景。具体而言,在该视图中将所有需要采集的数据项逐一识别后新增一个具有独特标识性的虚拟类。遵循如下命名逻辑:基于组件名称、层级编号及唯一标识三部分构成。其中对于table和image这两种组件,则需采取特别的方法进行处理:)在实际情况中,默认情况下绝大多数组件都会遵循这一命名规范。

在这里插入图片描述

当微页面被打开的时候 ,就会触发当前组件的js

在这里插入图片描述

通过getDataSetNodeFn 绑定监听移除移入的函数。(部分代码)

在这里插入图片描述

每当视图切换到可视区域时会捕获当前时间戳,在视图退出该区域后会捕获时间信息并进行比较:如果捕获的时间超过我们预设的时间阈值则会捕获当前数据并传递给神策系统

在这里插入图片描述

第二个场景是用户在微页面触发点击事件时的操作过程:小程序返回按钮、home键以及锁屏键等操作被触发后,在当前可视区域内活动过的相关组件的信息会被记录下来。具体来说,在这一情况下我们主要关注的是每当在当前可视区域中访问过相关组件时所积累的时间信息以及其他相关信息都会被存储在名为savePathObj的变量listenNodeObj中

在这里插入图片描述

此时可划分为两种情况。
当用户处于当前可见区域时,在不发生手势滑动的情况下,
通过点击等方式使用home键或其他方式退出当前页面,
从而触发该微页面。

当在移动端设备上执行操作时,
如果遇到无法正常完成的情况,
则系统将根据具体情况提供相应的提示信息。

在这里插入图片描述

onHide 或者是 onUnload事件 ,获取触发该事件的时间

在这里插入图片描述

当listenNodeObj.savePathObj中的每个组件在超过N秒后出现时,则进行采集。
第二个场景是,在用户进行手势滑动操作时,在listenNodeObj.savePathObj中记录的时间已超出移出屏幕之前的部分,则剩余的时间段即对应当前可视区域。

在这里插入图片描述

无论是哪种情况,在显示区域中的组件等于之前显示过的总数减去已退出屏幕的部分。因此,在这种情况下,请确保将所有显示区域中的组件全部获取,并筛选出满足要求的内容进行汇总报告即可。Tip:当微页面被 onhide 或者是 onUnload 的时候...

在这里插入图片描述

风险管控:一旦出现性能问题, 通过优化后台页面管理实现资源位管理, 并将微信客户端的isTrackFlag设置为false以停止数据采集. 无需单独开发小程序.

最后大家可以微信扫码一起学习交流哦

在这里插入图片描述

全部评论 (0)

还没有任何评论哟~