# asp-smart-collection

> - 第一步 安装依赖 cnpm i asp-smart-collection -S - 第二部 在 main.js 中引入 - 引入 import { Track } from 'asp-smart-collection' - 注册挂载 Vue.prototype.$Track = Track - 初始化 this.$Track.init(config) 初始化需要传配置参数 - init 方法 参数说明 类型 Object {} - url 字段类型 String 说明：请求 url

Latest version **1.0.17** (published 2023-07-12) · MIT license · 0 weekly downloads

## Install

```sh
npm install asp-smart-collection
pnpm add asp-smart-collection
yarn add asp-smart-collection
bun add asp-smart-collection
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; large bundle.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.17 |
| Published | 2023-07-12 |
| First published | 2021-02-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 112.1 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | zhangminshu@asp.com |
| Maintainers | mszhang |

## Links

- npm: https://www.npmjs.com/package/asp-smart-collection
- npm.io page: https://npm.io/package/asp-smart-collection

## Dependencies (3)

- [in-view](https://npm.io/package/in-view.md) ^0.6.1
- [babel-loader](https://npm.io/package/babel-loader.md) ^8.2.4
- [babel-polyfill](https://npm.io/package/babel-polyfill.md) ^6.26.0

## Recent versions

- 1.0.17 (latest) — 2023-07-12
- 1.0.16 — 2023-07-12
- 1.0.15 — 2023-07-07
- 1.0.14 — 2023-07-06
- 1.0.13 — 2022-08-22
- 1.0.12 — 2022-04-25
- 1.0.11 — 2022-04-25
- 1.0.10 — 2021-11-11
- 1.0.9 — 2021-11-03
- 1.0.8 — 2021-11-03
- 1.0.7 — 2021-10-27
- 1.0.6 — 2021-08-29
- 1.0.5 — 2021-08-26
- 1.0.4 — 2021-08-24
- 1.0.3 — 2021-04-12
- … 3 more at https://npm.io/package/asp-smart-collection/versions

## README

# 使用方式

- 第一步 安装依赖 cnpm i asp-smart-collection -S
- 第二部 在 main.js 中引入
- 引入 import { Track } from 'asp-smart-collection'
- 注册挂载 Vue.prototype.$Track = Track
- 初始化 this.$Track.init(config) 初始化需要传配置参数
  - init 方法 参数说明 类型 Object {}
  - url 字段类型 String 说明：请求 url 用户向后端提交收集到的信息 【必须】
  - userInfo 字段类型 Object 说明：用户信息 【非必须】
  - isTrackOnly 字段类型 Bool 说明：设置为 true 时，只支持有痕埋点 aspTrackEvent(event, data)
  - aspRequest 字段类型 function 说明：用于提交给后台收集到的信息的 API 【非必须】url, data

# 组件上报给后端服务器的参数说明如下：

## 无痕 PV 参数-事件点击行为

- { host, hashPath, fullPath, trackPath, userInfo, createTime, eventType, trackingType }
  - host 字段类型 String 说明：域名地址 ip+端口 eg： http://localhost:10001/
  - hashPath 字段类型 String 说明：页面地址带 hash 不带路由参数 eg：http://localhost:10001/#/login
  - fullPath 字段类型 String 说明：页面的完整地址 带路由参数 eg： http://localhost:10001/#/login?id=233
  - trackPath 字段类型 String 说明：事件轨迹 UV 事件时为空
    - 1、如果标签中有定义标识 如：<div><el-button data-trackid="点击按钮ID"><span>点击</span></el-button></div>, 此时 trackPath 的值就是“点击按钮 ID”
    - 2、如果没有定义标识，但 dom 元素中有描述 如 <div><el-button><span>点击</span></el-button></div> 此时 trackPath 的值就是“div>button>span>点击”
    - 3、没有标识 也没有描述 如：<div><el-button><span></span></el-button></div> 则返回标签轨迹 此时 trackPath 的值就是 “div>button>span”
  - createTime 字段类型 String 说明：事件触发时间 yyyy-mm-dd hh:mm:ss 年月日 时分秒
  - userInfo 字段类型 Object 说明：用户信息 由外部传入
  - eventType 字段类型 String 说明：事件类型 如：click
  - trackingType 字段类型 String 说明：数据收集类型 "1"为无痕 "2"为有痕
  - offsetX 字段类型 String 说明：点击页面时的 x 坐标
  - offsetY 字段类型 String 说明：y 坐标

## 无痕 PV 参数-页面跳转行为

-- { host, fullPath, hashPath, userInfo, createTime, trackPath ,userInfo, fromPath}

- fromPath 字段类型 String 说明：进入当前页面的前一个页面的完整地址 eg：http://localhost:10001/#/home
- host 字段类型 String 说明：域名地址 ip+端口 eg： http://localhost:10001/
- hashPath 字段类型 String 说明：页面地址带 hash 不带路由参数 eg：http://localhost:10001/#/login
- fullPath 字段类型 String 说明：页面的完整地址 带路由参数 eg： http://localhost:10001/#/login?id=233
- trackPath 字段类型 String 说明：事件轨迹 UV 事件时为空
- createTime 字段类型 String 说明：事件触发时间 yyyy-mm-dd hh:mm:ss 年月日 时分秒
- userInfo 字段类型 Object 说明：用户信息 由外部传入
- eventType 字段类型 String 说明：事件类型 如：click
- trackingType 字段类型 String 说明：数据收集类型 "1"为无痕 "2"为有痕

## 用户 UV 行为需要后台根据上传的数据自行过滤

## 有痕埋点 在代码中植入 aspTrackEvent(event, data)

- 包含无痕 PV 的所有信息 在此基础上 增加用户自定义的参数 data
- event 说明：事件触发时的 event 信息
- data 说明：用户自定义的信息 字段类型 Object

- 用法 this.$smartCollection.aspTrackEvent(event, data)

- 例如在 vue 页面总绑定点击事件 <el-button @click="(event) => { handleClick(event, '测试点击') }">点击</el-button>
-         handleClick (event, i) {
-            const data = { test: '2342' }
-            this.$smartCollection.aspTrackEvent(event, data)
-        },

## 外部 API

# aspSetOtherInfo(otherInfo) 补充设置埋点需要收集的额外信息

- 参数说明 otherInfo 字段类型 Object 数据收集的额外补充信息
- 用法 this.$smartCollection.aspSetOtherInfo(otherInfo)

---
_Source: https://npm.io/package/asp-smart-collection · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._