visual-buried-point-platform-miniprogram
v1.0.3
Published
To make it easy for you to get started with GitLab, here's a list of recommended next steps.
Downloads
67
Readme
微信小程序自定义埋点SDK集成文档
1、引入方式
npm install visual-buried-point-platform-miniprogram -S --registry=http://verdaccio.gogdev.cn/
工具-构建npm
2、初始化方式
app.js
//require引入
const analysis = require('visual-buried-point-platform-miniprogram')
require('./utils/mixins')
App({
onLaunch() {
//初始化sdk
analysis.init({
env: 'dev', //环境变量 dev test production
token: '3212414516342554624', //热果平台-可视化埋点-创建对应的项目生成. 【图1】
appKey: 'dsy_0FIBg8AHxwDP', //项目的appkey, 必填
sourceDomain: 'com.gzdzswy.onetravel', // 非必填,访问来源域名,取优先级:单次调上报值 > 全局初始化值
})
}
globalData: {
analysis: analysis //全局使用的 analysis 实例
}
});
3、设置绑定用户ID
- sdk初始化后,可通过 setUserId() 方法关联用户,sdk会默认生成一个游客ID
// 应用在注册或登录成功后,可调用下面API设置用户ID,后续产生的统计事件将会与该用户关联起来
getApp().globalData.analysis.setUserId("登录成功-用户ID")
示例:
getApp().globalData.analysis.setUserId(123456);
注:为保持数据统计精确,在退出登录的时候建议调用一次清空:
getApp().globalData.analysis.setUserId("");
4、自定义事件上报
- sdk初始化后,可通过 setCustomEvent() 方法上报自定义埋点事件,并为事件添加属性值:
4.1 事件类型:
- 仅能选择埋点提供的事件类型,各事件类型的触发、上报由各业务平台埋点自行确认。事件类型如下:
- 搜索事件【 search 】
- 动作事件【 action 】
- 点击事件【 click 】
- 浏览事件【 browse 】
// 调用自定义上报
getApp().globalData.analysis.setCustomEvent(data)
配置:
| 参数 | 必填 | 描述 | | ------------- | ---- | ------------------------------ | | $event_id | 是 | 对应创建的事件ID 【图2】 | | $extend_param | 否 | 扩展字段,建议根据业务需求填上 | | $busSegment | 否 | 业务板块 【表1】各自业务板块 | | $module | 否 | 业务模块【表1】各自业务模块 |
表1
业务板块 业务模块
busSegment module
1.景区/门票 1.门票
2.民宿/酒店 1.民宿 2.酒店
3.路线/定制 1.路线 2.定制
4.出行 1.盛威
5.美食 1.到店
6.购物 1.线上商城
7.文娱 1.场馆
8.社区 1.攻略 2.种草
9.活动 1.日历
10.多媒体 1.声入贵州
11.票务预约 1.景区
图2
示例:
// 注:
data: JSON字符串
{
$event_id: 对应创建的事件ID 【必填字段】
$extend_param: 扩展参数(JSON字符串) 【非必填字段,建议根据业务需求填上】
$busSegment: 业务板块 【非必填字段,建议业务填上, 否则数据统计可能出现缺失】
$module: 业务模块 【非必填字段,建议根据业务填上, 否则数据统计可能出现缺失】
$ctk: 渠道推广编码 【非必填字段,建议根据业务填上, 否则数据统计可能出现缺失】
$duration: 停留时长 【非必填字段】
}
// 参考:【点击事件】
const params = {
$event_id: "3213106620739878912", 【图2-事件ID】
$busSegment: 1,
$module: 1,
$title: "",
$ctk: "",
$extend_param: {
title: "自定义[点击事件]上报-点击_密码登录按钮",
clickContent: "密码登录",
....
....
}
}
getApp().globalData.analysis.setCustomEvent(params)
5、流量上报
- sdk初始化后,可通过onStartTrack(params) 方法注册上报流量,并为上报添加属性值:
注册上报流量:onStartTrack(params)
配置:【以下配置参数建议上报】
| 参数 | 必填 | 类型 | 描述 | | ------------ | ---- | ------------------- | ---------------- | | domain | 是 | string | 域名 | | path | 是 | string | 路径 | | circulation | 否 | number | 页面访问类型 | | ctk | 否 | string | 渠道推广编码 | | duration | 否 | number | 停留时长 | | busSegment | 否 | string | 业务板块 【表1】 | | module | 否 | string | 业务模块 【表1】 | | extend_param | 否 | JSON对象 {} | 扩展参数 | | sourceDomain | 否 | string | 访问来源域名 | | sourceUrl | 否 | string | 访问来源url | | title | 否 | string | 页面名称 | | traceId | 否 | string | 追踪id | | visitPage | 否 | number | 访问深度 | | visitTime | 否 | yyyy-MM-dd HH:mm:ss | 访问时间 |
示例:
// 注:
data: JSON对象
const params = {
domain: "xxxx",
busSegment: 1,
module: 1,
title: "店铺详情",
sourceDomain: 'com.gzdzswy.onetravel',
extend_param: {
goods_id: 123456, //商品id 【根据业务确定】
store_id: 1111, //店铺id 【...】
business_id: 222, //商户id 【...】
}
};
getApp().globalData.analysis.onStartTrack(params)
销毁上报流量:调用onDestroyTrack()进行销毁
示例:
getApp().globalData.analysis.onDestroyTrack()
注: 上报数据是否成功可查看NetWork栏,调用流量上报 track 接口 和 自定义上报 event 接口的 response
6、批量创建事件ID
main.py
用于批量创建和批量生成埋点数据的脚本,如不存在批量创建事件,可直接通过埋点管理端创建即可
准备
1.安装环境
需要在电脑上安装 python 环境
2.安装依赖
pip install requests
example示例:
1、在 utils/buryPoint
中创建各业务模块文件夹,并在文件夹下创建 parameter.py
文件 及 enum.js
文件,内容参考 route
【路线业务模块】 文件夹,并将 enum.js
在 index.js
中导出
.
2、按各自业务修改其中的变量名
- 注:重要!重要!:注意先查看main.py中需要修改的:
- projectId为埋点管理端上创建项目时生成的 token,参考 初始化方式 的图1
.
.
3、按需修改 main.py 最底部调用方法
- batchCreate: 批量创建【先执行第一步】
- batchWrite: 批量生成【再执行第二步】
先执行 batchCreate
方法将数据推到埋点后台管理系统中,再执行 batchWrite
方法,将后台管理中的数据写入到本地文件中
4、执行脚本
方式一(推荐)
在命令后增加业务模块文件夹名称,自动执行该文件夹下的参数文件
python main.py route
5、按环境生成 enum.xxx.js
文件,并在 utils/buryPoint/enum.js
中导出
注:这里默认会生成 `enum.commonm.js` 文件,如果后续生产或其他环境又是另外一份数据,到时候可以修改脚本,对不同环境进行适配
6、代码使用
查看 index.js
示例文件
import burialPointBehavior from '~/utils/buryPoint/burial-point-behavior'
import { burialPointRouteEnum, routeTrackCommonParams } from '~/utils/buryPoint/index'
Page({
behaviors: [burialPointBehavior]
onShow() {
this.startBurialPointTrack({
title: '目的地页',
...routeTrackCommonParams
})
},
// 点击搜索
onClickSearch() {
this.setBurialPointData(burialPointRouteEnum['点击-目的地页-搜索'])
},
// 点击地区
onClickAreaItem(e) {
const item = e.currentTarget.dataset.item
this.setBurialPointData(burialPointRouteEnum['点击-目的地页-切换区域'], { areaId: item.id })
},
// 点击右边
onClickRightItem(e) {
const item = e.currentTarget.dataset.item
this.setBurialPointData(burialPointRouteEnum['点击-目的地页-进入详情'], { destinationId: item.id })
},
})
7、埋点后台管理系统
云测管理端地址
- chameleon.gcongo.com.cn
8、SDK 文档
http://verdaccio.gogdev.cn/-/web/detail/visual-buried-point-platform-miniprogram