神策埋点安装记录

介绍

神策埋点安装记录

什么是埋点

• 公司业务需求 需要采集用户的一些访问量 并且精细到按钮 图片 表单信息的一些点击和提交按钮的采集 埋点采集的数据可以易于分析 统计 更好的更直观的展示用户的访问量
  • 公司采用的是 神策埋点 (opens new window) 本文也是围绕神策埋点进行一系列的安装

uniapp vue 埋点的操作指南

• 通过学习 该文章 (opens new window) 了解vue的埋点方法 实际上uniapp和vue步骤一致

1. 安装依赖

   • npm安装 神策埋点

npm install --save sa-sdk-javascript

2. 配置神策
   • 在 util 文件夹下新建 sensors.js，配置单页应用的固定代码，（非单页应用不需要加上配置对象： is_track_single_page: true）。

// 配置埋点
import sensors from 'sa-sdk-javascript'
sensors.init({ // 神策系统配置
  server_url: 'xxxx', // 数据接收地址 (这里写运维提供的地址)
  is_track_single_page: true, // 单页应用页面浏览事件采集(url改变就触发)
  use_app_track: true,
  show_log: true, // 控制台显示数据开关
  heatmap: { // 热图设置 default开启 not_collect关闭（详细配置解释看官方文档）
    clickmap: 'default', // 点击热图，收集点击事件
    scroll_notice_map: 'default', // 视区热图，收集页面区域停留时间
  }
})
// 设置埋点总属性 通常一个项目都是同意总属性 建议在配置文件中写 (根据运维提供名称)
 sensors.registerPage({
   platform_type: '利北小程序'
 })
sensors.quick('autoTrack') // 首次触发页面加载事件 $pageview
export default sensors

3. 全局注册神策埋点
   • 需要在入口文件导入配置好的神策埋点 然后添加在vue的根节点上

// 导入埋点
import sensors from '@/util/sensors.js'
// 在根目录注册神策埋点
Vue.prototype.$sensors = sensors

4. 在项目组注册埋点
   • 通常我们会注册事件埋点 就是在@click的方法中设置埋点 当用户点击按钮时候 触发埋点上传
   • 埋点的数据不需要我们对于设置 直接this获取数据即可
   • 埋点的按钮的总事件名 和 单独的事件名 需要和埋点人员约定

      // 埋点提交表单 (名称由埋点人员提供)
      // SubmitPointInfo为总事件名
        this.$sensors.track('SubmitPointInfo', {
        // 这里是单独的事件名 (数据为样板)
          ModelType: this.hotMt[this.index],
          model_detail: this.getLike[this.i],
          name: this.userName,
          Tel: this.userIphone,
          city: this.txt
        })

		// 埋点跳转页面
        this.$sensors.track('MiniProgramJump', {
            // 这里是判断提示框 用户是否点确认取消 (如果实在
          is_success: true,
          jump_name: '我要跳转到XXX',
          jump_url: 'pages/worriless/my/address/address'
        })

小程序 埋点的操作指南

• 暂时没做到 做到再记录