uniapp 小程序接入友盟

uniapp 小程序接入友盟统计：

1.项目 npm 的配置，在项目的根目录打开命令控制台：

npm init -y

这时候就会在更目录中有 package.json（我们这里不用修改文件）

2.下载友盟的包

npm install umtrack-wx  --save

3.配置

由于使用的是 uniapp 所以不能按照官方给出的方式来配置：

我们在 umeng.js 文件中加入一下内容：

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

// 此处用来挂载入 umeng 到组件实例上，方便组件内使用this.$umeng
umeng.install = function (Vue) {
    Vue.prototype.$umeng = umeng;
}

export default umeng;

在 main.js 文件中导入

import umeng from '@/path/umeng.js'
// 启用
Vue.use(umeng)

4.配置自定义事件

进入友盟的后台管理，添加自定义事件然后再小程序中对应的事件中加入以下代码就可以，监听点击了多少次。

配置自定义事件

5.小程序后台配置

在 request 合法域名地方添加域名：https://umini.shujupie.com，如下图

小程序request合法域名配置

6.代码里调用

直接看代码：this.$umeng.trackEvent('eventID'); // eventID 是在友盟后台你自己创建的如下：

demoClick() {
    this.$umeng.trackEvent('demo_click', {
        'url': this.__route__, // 当前小程序路径
        'page_name': '页面标题',
        'other_action': '其他事件',
    });
}

UINOTE