友盟umeng统计小程序 uniapp、微信小程序、抖音小程序

  1. 友盟+,国内领先的开发者服务及数据智能服务商
  2. 添加应用 
    友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第1张图片
  3. 创建应用
    友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第2张图片
    因为我是抖音和微信小程序,所以我注册两个应用
    创建成功,就会分配Appkey
    友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第3张图片
  4. 安装SDK及集成
    1. 下载SDK 开发者中心
    2. 因为我用uniapp写的微信和抖音端小程序,所以这两个我都下了
  5. 配置 

 

//utils 创建uma.js
//#ifdef MP-WEIXIN // #endif 这种注释千万不要删除哦,我当时以为是注释删掉了,后面找bug找的嗷嗷哭/(ㄒoㄒ)/~~
//是uniapp判断是在不同环境下,是否显示或隐藏。

// #ifdef MP-WEIXIN
import uma from 'umtrack-wx';
uma.init({
	appKey: 'xxxx', // 由友盟分配的APP_KEY
	useOpenid: true,
    // 使用Openid进行统计,此项为false时将使用友盟+uuid进行用户统计。
    // 使用Openid来统计微信小程序的用户,会使统计的指标更为准确,对系统准确性要求高的应用推荐使用Openid
	autoGetOpenid: true,
    // 使用openid进行统计时,是否授权友盟自动获取Openid,
    // 如若需要,请到友盟后台"设置管理-应用信息"(https://mp.umeng.com/setting/appset)中设置appId及secret
	debug: true,// 是否打开调试模式
    uploadUserInfo: true // 自动上传用户信息,设为false取消上传,默认为false
});
uma.install = function(Vue) {
	Vue.prototype.$uma = uma;
}
export default uma;
// #endif

// #ifdef MP-TOUTIAO
import uma from './uma.min.js';
uma.init({
	appKey: 'xxxx', // 由友盟分配的APP_KEY
	autoGetOpenid: true, // 是否需要通过友盟后台获取openid或匿名openid,如若需要,请到友盟后台设置appId及secret
    debug: true, //是否打开调试模式
    uploadUserInfo: true // 自动上传用户信息,设为false取消上传,默认为false
})
uma.install = function(Vue) {
	Vue.prototype.$uma = uma;
}


export default uma;
// #endif

main.js 引入

import uma from './utils/uma';
Vue.use(uma)

然后重新编译,命令行会提示成功的!

如果你没有成功,可以把报错发到评论区咱们一起解决 !

友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第4张图片

关于报错

友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第5张图片

 我问了umeng的技术人员,他们说是正常提醒

 自定义事件 埋点

添加自定义事件

  • 友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第6张图片
  • 友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第7张图片

把自定义事件嵌入前端代码


//this.uma.trackEvent('事件ID', { '属性1':'属性值1','属性2':'属性值2' });

// 字符型属性值,值需要添加‘’
//this.uma.trackEvent('ViewProductDetails', { 'Category':'家电','ItemName':'西门子冰箱' });

// 数值型属性值,值没有‘’
//this.uma.trackEvent('Pay', { 'PayAmount':6999 });

埋点验证

  • 友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第8张图片
  •  创建本次测试名称友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第9张图片
  • 友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第10张图片
  • 友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第11张图片复制之后选择重新编译
  • 这里有个很重要的点就是!!!!!! enableVerify:true,
    友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第12张图片

 已成功!友盟umeng统计小程序 uniapp、微信小程序、抖音小程序_第13张图片

你可能感兴趣的:(微信小程序,小程序,uni-app)