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
全局参数配置
| 参数名称 | 传参类型 | 默认值 | 说明 |
|---|---|---|---|
| bizLine | String | 09 | 业务线 |
| autoCheck | Boolean | true | 是否自动切换埋点方 |
| channel | String | '' (app和小程序cookie，pValue字段) | 渠道P值 |
| useBaidu | Boolean | false | 是否使用百度埋点 |
| baiduKey | String | 根据域名切到对应HASH | 百度HASH KEY |
| disableBdPageCommit | Boolean | false | 默认在使用tackPage会自动触发百度埋点，不希望这样做可以设置false，在合适地方调用baiduTrackPage，完成百度页面埋点 |
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: '业务线'
})| 参数名称 | 传参类型 | 默认值 | 是否必传 | 说明 |
|---|---|---|---|---|
| pageId | String | '' | 是 | 页面ID |
| pageName | String | document.title | 否 | 页面名称 |
| url | String | location.href | 否 | 页面url |
| referer | String | document.referrer | 否 | 来源页面 |
| duration | Number | 0 | 否 | 停留时间 |
| bizLine | String | 全局配置业务线 | 否 | 业务线 |
trackEvent
事件埋点
// 简单方式
finTrackWeb.trackEvent('事件ID')
// 带参数
finTrackWeb.trackEvent('事件ID', '参数')
// 详细设置
finTrackWeb.trackEvent({
eventId: '事件ID',
eventName: '事件名称',
eventType: 0, // 0-通用，1-点击，2-下拉，3-上拉，4-滚动，5-输入
attributes: '事件参数',
duration: '事件时长',
bizLine: '业务线'
})| 参数名称 | 传参类型 | 默认值 | 是否必传 | 说明 |
|---|---|---|---|---|
| eventId | String | '' | 是 | 事件ID |
| eventName | String | '' | 否 | 事件名称 |
| eventType | Number | 1 (0-通用，1-点击，2-下拉，3-上拉，4-滚动，5-输入) | 否 | 事件类型 |
| attributes | String | null | 否 | 事件参数 |
| duration | Number | 0 | 否 | 停留时间 |
| bizLine | String | 取当前页bizLine，没有会取全局bizLine | 否 | 业务线 |
baiduTrackPage
发送百度页面埋点数据，需要自己指定百度页面埋点发送时机使用
finTrackWeb.baiduTrackPage('页面相对路径url') // 例如：/m/democreate
创建一个实例，在单页面避免相互污染很有用处
let trackInstance = finTrackWeb.create(options) // options 参数同config
// 页面埋点
trackInstance.trackPage(...)
// 事件埋点
trackInstance.trackEvent(...)