美文网首页
[TalkingData] 如何在小程序中使用 TalkingD

[TalkingData] 如何在小程序中使用 TalkingD

作者: _liuz | 来源:发表于2017-05-17 19:16 被阅读0次

    http://doc.talkingdata.com/posts/484

    1. 配置 request 合法域名

    2. SDK 初始化

    1. 下载 SDK,解压,将其中的 tdweapp.js 文件导入项目
    2. 在项目的入口文件 app.js 中导入 SDK:
    var TD = require('./utils/tdweapp');
    

    在 app.js 的生命周期调用 SDK:

    App({
      onLaunch: function() {
        TD.launch({
          appKey: 'your-talkingdata-app-id',
          appName: 'your-app-name',
          versionName: 'versionName', // 小程序的可见版本号
          versionCode: 'versionCode', // 小程序的内部版本号,便于版本管理
          autoOnAppShow: true,
          autoOnAppHide: true,
          autoOnPageUnload: true,
          autoOnPullDownRefresh: true,
          autoOnReachBottom: true,
          autoOnShare: true
        });
      },
    
      onShow: function() {
        // TD.show(); // if autoOnAppShow == false
      },
    
      onHide: function() {
        // TD.hide(); // if autoOnAppHide == false
      }
    })
    

    采用自动采集处理方式时,TalkingData SDK 默认修改了微信小程序的生命周期,仅用于自动监听必要事件,不做其他处理。

    3. 高级统计 - 页面统计

    此功能可帮助开发者统计应用中各个页面的访问次数和停留时长,为产品优化提供依据。我们默认取当前页面path为pageName。

    在需要被统计的页面内导入SDK,在相关生命周期调用SDK,页面在关闭时会将页面访问信息上报。

    微信目前提供了两种不同的页面实现方式:Navigation等链接方式、Tabs方式。Navigation等链接方式下,微信小程序会依次触发onLoad、onUnload;在Tabs方式下,微信小程序不会多次触发onLoad、onUnload,所以这种方式下需要在onShow中进行调用才能准确统计页面数据。

    两种实现方式下具体调用方法如下:

    1. 当页面实现方式为Tabs时,在onShow、onHide位置进行调用:
    var TD = require('../../utils/tdweapp');
    Page({
      onShow: function() {
        TD.Page.load(true); // true: Tabs method
      },
      onHide: function() {
        // TD.Page.unload(); // if autoOnPageUnload == false
      }
    })
    
    1. 当页面实现方式为navigation等链接方式打开时,在onLoad、onUnload位置进行调用:
    var TD = require('../../utils/tdweapp');
    Page({
      onLoad: function() {
        TD.Page.load();
      },
      onUnload: function() {
        // TD.Page.unload(); // if autoOnPageUnload == false
      }
    })
    

    4. 高级统计 - 自定义事件

    自定义事件用于统计任何您期望跟踪的数据,如:用户点击某功能按钮、填写某个输入框、触发了某个广告等。 完成这些自定义事件统计后可以在报表对其进行统计分析并进行关键路径转化分析。

    4.1 自定义事件接口

    调用 TD.event() 方法上报自定义事件:

    <view bindtap="bindEvent">
      <text>点我出发自定义事件</text>
    </view>
    
    var TD = require('../../utils/tdweapp');
    
    Page({
      onLoad: function(){
        TD.Page.load();
      },
    
      onUnload: function() {
        // TD.Page.unload(); // if autoOnPageUnload == false
      },
    
      bindEvent: function() {
        TD.event({
          id: 'id1',
          label: 'label1',
          params: {
            key: 'key1',
            value: 'value1'
          }
        });
      }
    })
    

    4.2 标准事件接口

    对于微信小程序的标准事件:分享、下拉刷新、页面触底,我们提供了标准事件接口:

    如果在SDK初始化时以下参数为true时,我们自动采集分享事件:

    autoOnPullDownRefresh: true,
    autoOnReachBottom: true,
    autoOnShare: true
    

    如果不希望自动采集以上三个标准事件,也可以调用以下方法,完成对上述用户行为的统计。建议采用与我们相同的事件ID、Lable及参数, 以便报表对此事件做更深入分析。

    如果以上参数不能满足您的需求,您也可以采用按需调用TD.event()进行事件追踪。

    var app = getApp();
    
    var TD = require('../../utils/tdweapp.js');
    
    Page({
      onLoad() {
        TD.Page.load();
      },
    
      onUnload() {
        TD.Page.unload();
      },
    
      onShareAppMessage () {
        TD.Page.share({
          title: 'custom share title',
          desc: 'custom share description',
          path: 'page/page3/index?a=1&b=2&from=tdsdk'
        });
    
        return {
          title: 'custom share title',
          desc: 'custom share description',
          path: 'page/page3/index?a=1&b=2&from=tdsdk'
        }
      },
    
      onPullDownRefresh() {
        TD.Page.pullDownRefresh();
      },
      onReachBottom() {
        TD.Page.onReachBottom();
      }
    });
    

    相关文章

      网友评论

          本文标题:[TalkingData] 如何在小程序中使用 TalkingD

          本文链接:https://www.haomeiwen.com/subject/ckxjxxtx.html