埋点的开发比较耗时,H5页面自动化埋点的方式可以考虑在根节点监听冒泡上来的时间,判断特定的属性来做埋点。但是微信小程序的生态也比较封闭,组件事件无法冒泡到父组件,或者上级有使用catchtap截断了事件冒泡,这些都导致自动化埋点难以实施。
基于以上原因,配置化埋点考虑的是在需要埋点的地方调用埋点,然后通过配置表取到对应的事件配置,在转化为真实的埋点数据进行上报。
// 埋点SDK
import Tracker from '../../track/index'
// 创建页面的方法
import { createPage } from '../../track/page'
// 创建页面
createPage({
//...
})
需要在页面同级目录下创建trackConfig.js配置文件
需要给有埋点的页面添加配置文件,配置文件包含页面名(pageName)和事件对象,
事件对象包含埋点事件名和参数配置
事件对象的key对于Tracker.track方法中的action参数
pageName: 埋点中的页面名
埋点事件配置
name: 上报的埋点事件名
params: 埋点事件的参数配置
export default {
pageName: '首页',
addToCarts: {
name: 'yh_elementClick',
params: {
yh_elementName: '加入购物车',
yh_moduleName: '{args.moduleName}',
yh_elementIndexNum: '{args.index}',
yh_productId: '{page.data.floors[args.floorIndex].goods[args.index].id}',
yh_productName: '{page.data.floors[args.floorIndex].goods[args.index].name}',
abVersion: '{page.abVersion}',
storeId: '{page.data.storeId}',
titleId: '{page.data.titles[page.data.titleIdx].id}',
titleName: '{page.data.titles[page.data.titleIdx].name}',
uId: '{APP.globalData.userInfo.uId}',
}
}
}
yh_elementName: '加入购物车'
// 代表从track方法中的args参数中读取的moduleName属性
yh_moduleName: '{args.moduleName}',
// [args.index] 嵌套引用,代表从args中获取数组的索引值
yh_productId: '{page.data.floors[args.floorIndex].goods[args.index].id}',
uId: '{APP.globalData.userInfo.uId}',
const { data, index, floorIndex } = this.data
Tracker.track({
action: 'addToCarts',
args: {
...data,
moduleName: 'Goods',
index,
floorIndex
}
})