monitoring-burial-point

用作前端埋点监控，进行项目错误日志上报以及无痕埋点上报

安装方式

npm install monitoring-burial-point

初始化方式

在mian.ts文件中使用，以Vue3为例，放在const app = createApp(App)之前

import { initMonitor } from 'monitoring-burial-point'
//开启前端错误上报，无痕埋点上报
initMonitor({
  userId: "user0001", // userId
  reportUrl: "http://localhost:3009/report/actions", // 上报的后端地址
  delay: 1000, // 延时上报的时间
  autoTracker: true, // 自动埋点 
  errorReport: true, // 是否开启错误监控
});

无痕埋点案例

为相应的dom元素添加data-target属性，例如：

<button data-target="自动上报按钮1被点击了">自动上报按钮1</button>

在绑定了data-target之后，用户点击就会进行上报

上报规则

采用navigator.sendBeacon 和 Img图片上报

navigator.sendBeacon() 是一个Web API，它允许网页在卸载（unload）之前向服务器发送少量数据
这个方法主要用于发送分析数据、诊断信息或用户行为数据
以确保这些数据即使在用户关闭页面或导航到另一个页面时也能被发送。

Img图片上报，通过创建一个img标签，设置src属性为后端地址，将数据作为查询参数拼接到url中，通过img标签的src属性发送请求，实现无痕上报。

延迟上报delay

当不开启或者为0的时候，埋点上报会马上执行
当开启并设计时间会延迟上报，做防抖处理
最多缓存10条