工作中需要将app上架到浙政钉,最后采用了用uniapp开发h5应用的方式,但上架浙政钉h5需要埋点,官方文档也看不太懂,好不容易鼓捣出来了,现将方法记录一下。
首先讲一下,埋点代码分为:稳定性监控代码(Emas)和流量分析代码(A+);
其中流量分析代码(A+)包含通用采集SDK、基础埋点、用户信息埋点;
稳定性监控代码(Emas)只需要在首页加入(小程序不需要埋稳定性监控代码)。
流量分析代码(A+)每个页面都需要加入,也可以写通用js,在其他页面引入。
1、稳定性监控代码,在App.vue中script下添加如下代码就ok了,同时顺便引入了通用采集的SDK
// 稳定性监控
const script = document.createElement('script')
script.src = 'https://wpk-gate.zjzwfw.gov.cn/static/wpk-jssdk.1.0.2/wpkReporter.js'
script.onload = initWpk.bind(this)
document.head.appendChild(script)
function initWpk() {
try {
const config = {
bid: 'xxxxx',
signkey: 'xxxxx',
gateway: 'https://wpk-gate.zjzwfw.gov.cn'
};
const wpk = new wpkReporter(config);
wpk.installAll();
window._wpk = wpk;
} catch (err) {
console.error('WpkReporter init fail', err);
}
}
// 通用采集
(function(w, d, s, q, i) {
w[q] = w[q] || [];
var f = d.getElementsByTagName(s)[0],j = d.createElement(s);
j.async = true;
j.id = 'beacon-aplus';
j.src = 'https://alidt.alicdn.com/alilog/mlog/aplus_cloud.js';
f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'aplus_queue');
2、流量分析代码,首先在工具类中引入公用埋点方法
/**
* 页面流量分析代码-埋点
* @param {Object} sapp_id
* @param {Object} sapp_name
* @param {Object} 页面id
* @param {Object} 页面名称
* @param {Object} 页面地址
* @param {Object} 用户id
*/
eventTracking(sapp_id, sapp_name, page_id, page_name, page_url, userId) {
//通用采集
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-rhost-v', 'alog.zjzwfw.gov.cn']
});
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-rhost-g', 'alog.zjzwfw.gov.cn']
});
var u = navigator.userAgent
var isAndroid = u.indexOf('Android') > -1
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['appId', isAndroid ? '28302650' : isIOS ? '28328447' : '47130293']
});
// 如采集用户信息是异步行为需要先执行这个BLOCK埋点
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_hold', 'BLOCK']
});
//基础埋点
// 单页应用 或 “单个页面”需异步补充PV日志参数还需进行如下埋点:
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-waiting', 'MAN']
});
// 单页应用路由切换后 或 在异步获取到pv日志所需的参数后再执行sendPV:
aplus_queue.push({
'action':'aplus.sendPV',
'arguments':[{
is_auto: false
}, {
// 当前你的应用信息,此两行请勿修改
sapp_id: sapp_id,
sapp_name: sapp_name,
// 自定义PV参数key-value键值对(只能是这种平铺的json,不能做多层嵌套),如:
page_id: page_id,
page_name: page_name,
page_url: page_url
}]
})
// 用户信息埋点
aplus_queue.push({
action: "aplus.setMetaInfo",
arguments: ["_user_id", '' + userId]
});
// 如采集用户信息是异步行为,需要先设置完用户信息后再执行这个START埋点
// 此时被block住的日志会携带上用户信息逐条发出
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_hold', 'START']
});
}
在每个页面的onLoad函数中调用该方法,其中eventTracking参数的sapp_id,sapp_name,menuTitle,userId对应修改成自己的即可
// 埋点
let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
let curRoute = routes[routes.length - 1].route //获取当前页面路由
this.$common.eventTracking(this.$config.sapp_id, this.$config.sapp_name, curRoute,
this.menuTitle, this.$config.api + curRoute, uni.getStorageSync("userId"));