# @yangguoxin/fin-track-web

> fin-track js 埋点SDK

Latest version **0.1.8** (published 2021-07-13) · ISC license · 0 weekly downloads

## Install

```sh
npm install @yangguoxin/fin-track-web
pnpm add @yangguoxin/fin-track-web
yarn add @yangguoxin/fin-track-web
bun add @yangguoxin/fin-track-web
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.8 |
| Published | 2021-07-13 |
| First published | 2021-07-13 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 72.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | 无线中心 |
| Maintainers | ygx763123 |
| Keywords | fin, fin-track, fin-track-web, 埋点 |

## Links

- npm: https://www.npmjs.com/package/@yangguoxin/fin-track-web
- npm.io page: https://npm.io/package/@yangguoxin/fin-track-web

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.1.8 (latest) — 2021-07-13

## README

# fin-track-web

H5页面埋点SDK

## 快速上手

### CDN 引入

```html
<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](http://wiki.blackfi.sh/pages/viewpage.action?pageId=9195584)*

#### 安装

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

#### 使用

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

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

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

```

## API

### config
全局参数配置

参数名称 | 传参类型 | 默认值 | 说明
---- | ---- | ---- | ----
bizLine | String | 09 | [业务线](http://wiki.blackfi.sh/pages/viewpage.action?pageId=4530577)
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已有
```js
// [官网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
页面埋点

```js
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 | 全局配置业务线 | 否 |[业务线](http://wiki.blackfi.sh/pages/viewpage.action?pageId=4530577)

### trackEvent
事件埋点

```js
// 简单方式
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 | 否 |[业务线](http://wiki.blackfi.sh/pages/viewpage.action?pageId=4530577)

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

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

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

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

---
_Source: https://npm.io/package/@yangguoxin/fin-track-web · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._