monitor-report v1.0.1

前端日志收集

介绍

一个用来帮助前端收集错误、操作、pv / uv 统计等，采用ts全程编写，一套完整的库 ，适用于 react ， vue ， 原生html 等前端技术

主要围绕三个维度收集数据

1. 错误日志
2. 操作日志埋点
3. pv / uv 统计

安装教程

npm i monitor-report

使用说明

简单使用

import monitorReport from 'monitor-report'
monitorReport({
  errorOptions: {
    url: "http://127.0.0.1:8888/monitor/error/report",
  },
  mode: "History",
  log: true 
})

成功后日志中会出现成功标识

options

errorOptions 错误配置

type: object | false

default： false

behaviorOptions 操作配置

type: object | false

default： false

PvUvOptions pvuv配置

type: object | false

default： false

mode 路由模式

type: 'Hash' | 'History'

default: 'History'

log 是否打印日志

type: boolean

default: true

isReport 是否上报数据

type: boolean

default: fasle

customFields 自定义上传字段

type: object

default: {}

上报内容

公共数据

错误上报

实例

import monitorReport from 'monitor-report'
monitorReport({
  errorOptions: {
    url: "http://127.0.0.1:8888/monitor/error/report",
  },
  mode: "History",
  log: true 
})

操作上报

注：

提供了两个自定义标签属性 no-use（不触发上报） 、data-info（上报的数据）

实例

import monitorReport from 'monitor-report'
monitorReport({
  behaviorOptions: {
    url: "http://127.0.0.1:8888/monitor/error/report",
  },
  mode: "History",
  log: true 
})

pv uv 上报

实例

import monitorReport from 'monitor-report'
monitorReport({
  pvUvOptions: {
    url: "http://127.0.0.1:8888/monitor/error/report",
  },
  mode: "History",
  log: true 
})

自定义上报

实例

import monitorReport from 'monitor-report'
const {errorReporting, behaviorReporting,pvUvReporting }=  monitorReport({
  pvUvOptions: {
    url: "http://127.0.0.1:8888/monitor/error/report",
  },
  mode: "History",
  log: true 
})

errorReporting： 错误上报， 参数同上

behaviorReporting： 操作上报 参数同上

pvUvReporting： pvuv上报 参数同上