@yangguoxin/fin-track-web v0.1.8

fin-track-web

H5页面埋点SDK

快速上手

CDN 引入

<script>
  (function() {
    var track = document.createElement("script")
    track.src = "//static.blackfish.cn/bff/fin-track-web/fin-track-web.min.js"
    track.onload = function() {
      finTrackWeb
        .config({
          bizLine: '19',
          useBaidu: true, // 开启百度埋点
          baiduKey: '1451f9abd2d8aa8486075f7b8cd3b006' // 网址百度的hash code
        })
        .trackPage() // 发送页面埋点
    }
    var s = document.getElementsByTagName("script")[0]
    s.parentNode.insertBefore(track, s)
  })()
</script>

NPM 方式

NPM源需要切换小黑鱼NPM

安装

$ npm install @blackfish/fin-track-web --save

使用

import finTrackWeb from '@blackfish/fin-track-web'

// 合适地方调用
// 全局配置
finTrackWeb.config({
  bizLine: '19'
})
// 页面埋点
finTrackWeb.trackPage({pageId: '090020015'})

// 事件埋点
finTrackWeb.trackEvent('090020018003')

API

config

全局参数配置

ps: 百度埋点自动识别hash已有

// [官网m站]
'm\\.blackfish\\.cn': '1b054982ae09179e461552e4dc2d11cd',
// [官网pc站]
'www\\.blackfish\\.cn': 'b77bb6b058b63ad11827b818b8893377',
// [APP内嵌h5]
'h5\\.blackfish\\.cn\\/m': '1451f9abd2d8aa8486075f7b8cd3b006',
// [商城]
'h5\\.blackfish\\.cn\\/fsh': '2d250904c7957213ab6c33516eb73e5a',
// [推广页面]
'p\\.blackfish\\.cn': 'ee2a01bf5ecee8eeff105c07bd2ce4a5',
// [贷款超市]
'lmf\\.blackfish\\.cn': '0732fd6a26c8fc29dd79d8db4f94c119'

trackPage

页面埋点

finTrackWeb.trackPage({
  pageId: 'pageId',
  pageName: '页面名称',
  url: '页面url',
  referer: '来源页url',
  duration: '页面停留时间',
  bizLine: '业务线'
})

trackEvent

事件埋点

// 简单方式
finTrackWeb.trackEvent('事件ID')
// 带参数
finTrackWeb.trackEvent('事件ID', '参数')
// 详细设置
finTrackWeb.trackEvent({
  eventId: '事件ID',
  eventName: '事件名称',
  eventType: 0, // 0-通用，1-点击，2-下拉，3-上拉，4-滚动，5-输入
  attributes: '事件参数',
  duration: '事件时长',
  bizLine: '业务线'
})

baiduTrackPage

发送百度页面埋点数据，需要自己指定百度页面埋点发送时机使用

finTrackWeb.baiduTrackPage('页面相对路径url') // 例如：/m/demo

create

创建一个实例，在单页面避免相互污染很有用处

let trackInstance = finTrackWeb.create(options) // options 参数同config
// 页面埋点
trackInstance.trackPage(...)
// 事件埋点
trackInstance.trackEvent(...)