monitor-track 1.10.0

package/CHANGELOG.md

@@ -0,0 +1,31 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## 1.10.0 (2023-08-25)
+
+
+### ✨ Features
+
+* monitor ([23011cb](https://github.com/zhoushoujian/monitor/commit/23011cb1b2c15adf4de96c481f3b11347673b715))
+* update ([3c21c91](https://github.com/zhoushoujian/monitor/commit/3c21c91afc136333145c3512576051f4e915f15c))
+
+
+
+## 1.10.0 (2023-08-25)
+
+
+### ✨ Features
+
+* monitor ([23011cb](https://github.com/zhoushoujian/monitor/commit/23011cb1b2c15adf4de96c481f3b11347673b715))
+* update ([22968bc](https://github.com/zhoushoujian/monitor/commit/22968bc7aaef009637b91ff01ca0a07a441d652b))
+
+
+
+## 1.10.0 (2023-08-25)
+
+
+### ✨ Features
+
+* monitor ([23011cb](https://github.com/zhoushoujian/monitor/commit/23011cb1b2c15adf4de96c481f3b11347673b715))

package/README.md

@@ -0,0 +1,101 @@
+# 前端监控及埋点 SDK 工具
+
+## 使用
+
+```shell
+# using npm
+$ npm install monitor-track -S
+
+```
+
+```typescript
+import Track from 'monitor-track';
+
+const track = new Track();
+
+track.init({
+  // 由监控平台后台管理系统创建项目时生成
+  projectID: '123',
+  reportUrl: 'http://localhost:3008/report',
+  spa: true,
+  // 不是hash模式的项目一定要改成false，否则不能统计到pv的类型
+  hash: true,
+});
+```
+
+## 配置项
+
+| 配置项                | 类型          | 必填 | 默认值 | 注释                                               |
+| --------------------- | ------------- | ---- | ------ | -------------------------------------------------- |
+| reportUrl             | string        | 是   | ''     | 上报地址，后台地址                                 |
+| projectID             | string        | 是   | ''     | 项目 ID                                            |
+| spa                   | boolean       | 否   | false  | 是否为单页面应用，主要区别页面性能，及路由切换行为 |
+| hash                  | boolean       | 否   | false  | 路由是否为 hash 模式                               |
+| enableBehavior        | boolean       | 否   | true   | 启用用户行为上报                                   |
+| enableError           | boolean       | 否   | true   | 启用异常信息上报                                   |
+| enableVisualTrack     | boolean       | 否   | false  | 启用可视化埋点上报                                 |
+| ignore                | 见下方 ignore | 否   | false  | 忽略上报的信息                                     |
+| customPayload         | string        | 否   | false  | 自定义 payload                                     |
+| enable                | boolean       | 否   | false  | 是否开启日志收集，默认关闭                         |
+| maxLength             | number        | 否   | 1000   | 最长上报数据长度                                   |
+| XMLHttpRequestTimeout | number        | 否   | 1000   | 上报 xhr 请求超过指定时间                          |
+
+### ignore
+
+| 参数   | 类型     | 必填 | 默认值 | 注释           |
+| ------ | -------- | ---- | ------ | -------------- |
+| urls   | string[] | 否   | []     | 忽略的 url     |
+| errors | string[] | 否   | []     | 忽略的异常信息 |
+| apis   | string[] | 否   | []     | 忽略的接口     |
+
+## 全局方法
+
+```typescript
+//注意：以下window上的方法，如果没有enable埋点，那么这些window上的方法都不存在
+
+//手动上报视频录像, 视频时间应当在30秒到60秒之间
+if (typeof window.getRRWebUserEventsCaptureFunc ！== 'undefined') {
+  window.getRRWebUserEventsCaptureFunc()
+} else {
+  //console.log('getRRWebUserEventsCaptureFunc is undefined, check monitor-track version!)
+}
+
+//手动截图, 图片内容包含整个页面内容，注意getFullScreenShootFunc返回一个Promise
+if (typeof window.getFullScreenShootFunc ！== 'undefined') {
+  window.getFullScreenShootFunc().catch((err) => { console.error('截图失败', err) })
+} else {
+  //console.log('getFullScreenShootFunc is undefined, check monitor-track version!)
+}
+
+//手动上报,data必须是一个对象
+if (typeof window.manualReportTrackFunc ！== 'undefined') {
+  window.manualReportTrackFunc(data)
+} else {
+  //console.log('manualReportTrackFunc is undefined, check monitor-track version!)
+}
+```
+
+## 项目引入时，定义环境变量，防止开发环境中上报信息
+
+```javascript
+// webpack中配置环境变量
+
+new webpack.DefinePlugin({
+  isDev: 'development',
+});
+```
+
+```typescript
+const isDevEnv = typeof isDev !== 'undefined';
+
+if (isDevEnv) {
+  track.init({
+    // 由监控平台后台管理系统创建项目时生成
+    projectID: '123',
+    reportUrl: 'http://localhost:3008/report',
+    spa: true,
+    // 不是hash模式的项目一定要改成false，否则不能统计到pv的类型
+    hash: true,
+  });
+}
+```

package/dist/CHANGELOG.md

@@ -0,0 +1,21 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## 1.10.0 (2023-08-25)
+
+
+### ✨ Features
+
+* monitor ([23011cb](https://github.com/zhoushoujian/monitor/commit/23011cb1b2c15adf4de96c481f3b11347673b715))
+* update ([22968bc](https://github.com/zhoushoujian/monitor/commit/22968bc7aaef009637b91ff01ca0a07a441d652b))
+
+
+
+## 1.10.0 (2023-08-25)
+
+
+### ✨ Features
+
+* monitor ([23011cb](https://github.com/zhoushoujian/monitor/commit/23011cb1b2c15adf4de96c481f3b11347673b715))

package/dist/README.md

@@ -0,0 +1,101 @@
+# 前端监控及埋点 SDK 工具
+
+## 使用
+
+```shell
+# using npm
+$ npm install monitor-track -S
+
+```
+
+```typescript
+import Track from 'monitor-track';
+
+const track = new Track();
+
+track.init({
+  // 由监控平台后台管理系统创建项目时生成
+  projectID: '123',
+  reportUrl: 'http://localhost:3008/report',
+  spa: true,
+  // 不是hash模式的项目一定要改成false，否则不能统计到pv的类型
+  hash: true,
+});
+```
+
+## 配置项
+
+| 配置项                | 类型          | 必填 | 默认值 | 注释                                               |
+| --------------------- | ------------- | ---- | ------ | -------------------------------------------------- |
+| reportUrl             | string        | 是   | ''     | 上报地址，后台地址                                 |
+| projectID             | string        | 是   | ''     | 项目 ID                                            |
+| spa                   | boolean       | 否   | false  | 是否为单页面应用，主要区别页面性能，及路由切换行为 |
+| hash                  | boolean       | 否   | false  | 路由是否为 hash 模式                               |
+| enableBehavior        | boolean       | 否   | true   | 启用用户行为上报                                   |
+| enableError           | boolean       | 否   | true   | 启用异常信息上报                                   |
+| enableVisualTrack     | boolean       | 否   | false  | 启用可视化埋点上报                                 |
+| ignore                | 见下方 ignore | 否   | false  | 忽略上报的信息                                     |
+| customPayload         | string        | 否   | false  | 自定义 payload                                     |
+| enable                | boolean       | 否   | false  | 是否开启日志收集，默认关闭                         |
+| maxLength             | number        | 否   | 1000   | 最长上报数据长度                                   |
+| XMLHttpRequestTimeout | number        | 否   | 1000   | 上报 xhr 请求超过指定时间                          |
+
+### ignore
+
+| 参数   | 类型     | 必填 | 默认值 | 注释           |
+| ------ | -------- | ---- | ------ | -------------- |
+| urls   | string[] | 否   | []     | 忽略的 url     |
+| errors | string[] | 否   | []     | 忽略的异常信息 |
+| apis   | string[] | 否   | []     | 忽略的接口     |
+
+## 全局方法
+
+```typescript
+//注意：以下window上的方法，如果没有enable埋点，那么这些window上的方法都不存在
+
+//手动上报视频录像, 视频时间应当在30秒到60秒之间
+if (typeof window.getRRWebUserEventsCaptureFunc ！== 'undefined') {
+  window.getRRWebUserEventsCaptureFunc()
+} else {
+  //console.log('getRRWebUserEventsCaptureFunc is undefined, check monitor-track version!)
+}
+
+//手动截图, 图片内容包含整个页面内容，注意getFullScreenShootFunc返回一个Promise
+if (typeof window.getFullScreenShootFunc ！== 'undefined') {
+  window.getFullScreenShootFunc().catch((err) => { console.error('截图失败', err) })
+} else {
+  //console.log('getFullScreenShootFunc is undefined, check monitor-track version!)
+}
+
+//手动上报,data必须是一个对象
+if (typeof window.manualReportTrackFunc ！== 'undefined') {
+  window.manualReportTrackFunc(data)
+} else {
+  //console.log('manualReportTrackFunc is undefined, check monitor-track version!)
+}
+```
+
+## 项目引入时，定义环境变量，防止开发环境中上报信息
+
+```javascript
+// webpack中配置环境变量
+
+new webpack.DefinePlugin({
+  isDev: 'development',
+});
+```
+
+```typescript
+const isDevEnv = typeof isDev !== 'undefined';
+
+if (isDevEnv) {
+  track.init({
+    // 由监控平台后台管理系统创建项目时生成
+    projectID: '123',
+    reportUrl: 'http://localhost:3008/report',
+    spa: true,
+    // 不是hash模式的项目一定要改成false，否则不能统计到pv的类型
+    hash: true,
+  });
+}
+```

package/dist/cjs/config/global.d.ts

@@ -0,0 +1,17 @@
+import { IReport } from '../types/global';
+/**
+ * @description 初始化上报数据并上报
+ */
+export declare function initReport(): void;
+/**
+ * @description 设置Report的值
+ * @param key Report key
+ * @param value Report 值
+ */
+export declare function setReportValue<T extends IReport, K extends keyof T>(key: K, value: T[K]): void;
+/**
+ * @description 获取上报数据
+ */
+export declare function getReport(): IReport;
+export declare const recordXMLHttpRequestLog: (XMLHttpRequestTimeout?: number) => void;
+export declare const hackFetch: (XMLHttpRequestTimeout?: number) => void;

package/dist/cjs/config/index.d.ts

@@ -0,0 +1,33 @@
+import { IConfig } from '../types/config';
+/**  */
+/**
+ * @description config配置项默认值
+ */
+export declare const Config: IConfig;
+/**
+ * @description 设置config配置项
+ * @param config 配置项
+ */
+export declare function setConfig(config: IConfig): void;
+/**
+ * @description 设置config配置项
+ * @param config 配置项
+ */
+export declare function setConfigValue<T extends IConfig, K extends keyof T>(key: K, value: T[K]): void;
+/**
+ * @description 获取通过key值获取配置项value
+ * @param key
+ * @returns value的值
+ */
+export declare function getConfigValue(key: keyof IConfig): string | number | boolean | {
+    urls?: string[] | undefined;
+    errors?: (string | {
+        regExp: boolean;
+        /**
+         * @description 设置config配置项
+         * @param config 配置项
+         */
+        input: string;
+    })[] | undefined;
+    apis?: string[] | undefined;
+} | undefined;

package/dist/cjs/constant.d.ts

@@ -0,0 +1,2 @@
+export declare const shuyunTrackId = "shuyun-track-id";
+export declare const shuyunTrackSessionId = "shuyun-track-session-id";

package/dist/cjs/handlers/error.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @description 错误事件触发后的操作
+ */
+export declare function handleError(event: ErrorEvent | Event | PromiseRejectionEvent): void;
+/**
+ * @description 设置错误信息
+ */
+export declare function setCaughtError(event: ErrorEvent): void;
+/**
+ * @description 设置异步错误信息
+ */
+export declare function setPromiseError(event: PromiseRejectionEvent): void;
+/**
+ * @description 设置资源错误信息
+ */
+export declare function setResourceError(event: Event): void;
+/**
+ * 忽略的error
+ * @param errorMsg 错误信息
+ */
+export declare function ignoreError(errorMsg: string): boolean;
+export declare function getUserEvents(notUseCache: boolean): string | undefined;
+export declare function getFullScreenShoot(filename: string | undefined): Promise<File>;

package/dist/cjs/handlers/index.d.ts

@@ -0,0 +1,3 @@
+export * as pv from './pv';
+export * as error from './error';
+export * as userActivity from './user-activity';

package/dist/cjs/handlers/pv.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @description 派发pushState， replaceState 的监听
+ * @param type
+ */
+export declare function _history(type: 'pushState' | 'replaceState'): () => void;
+/**
+ * @description 处理hash变化
+ * @param e hash事件
+ */
+export declare function handleHashChange(__e: Event): void;
+/**
+ * @description 处理history变化
+ * @param e history事件
+ */
+export declare function handleHistoryChange(__e: Event): void;
+export declare function setPVTime(): void;
+/**
+ * @description 添加路由栈信息
+ * @param page 页面信息
+ */
+export declare function setRouteStack(page: string | string[]): {
+    originPage: string;
+    page: string;
+};

package/dist/cjs/handlers/user-activity.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @description 点击事件触发后的操作
+ */
+export declare function handleClick(event: Event): void;
+/**
+ * @description 点击触发失焦后的操作
+ */
+export declare function handleBlur(event: Event): void;
+export declare function handleScroll(_event: Event): void;

package/dist/cjs/index.d.ts

@@ -0,0 +1,30 @@
+import { IConfig } from './types/config';
+export default class Track {
+    init(config: IConfig): void;
+    visualTrack: () => void;
+    /**
+     * @description 监听错误异常
+     */
+    addListenJSUncaught(): void;
+    /**
+     * @description 监听行为
+     */
+    addListenUserActivity(): void;
+    /**
+     * @description 监听路由变化
+     */
+    addListenRouterChange(): void;
+    /**
+     * @description 页面将要关闭
+     */
+    addListenUnload(): void;
+    /**
+     * 忽略的url
+     * @param urls
+     */
+    ignoreUrl(urls: string[]): boolean;
+    /**
+     * @description 销毁监听器
+     */
+    destroy(): void;
+}