fe-monitor-report

介绍

前端监控上报系统，能够统计页面性能、ajax监控及页面错误，并能进行上报

安装

// npm：
npm i fe-monitor-report -S
// 浏览器：
<scripe src="//www.example.com/asset/js/fe-monitor-report.js"></scripe>

使用

// npm
const Monitor = require('fe-monitor-report');
const monitor = new Monitor({
    // 上报地址
    reportUrl: 'http://localhost:8080/',
    // 监控的项目名称
    projectName: 'myProject',
    // 超时设置(包含资源请求超时、ajax超时等)，单位毫秒。请求时间超过此值的请求将上报
    timeout: 3000,
    // 大小设置，单位字节B。资源大小超过此值的请求将上报，这里是300K
    maxSize: 300 * 1024,
    // 接口返回的code的字段名称
    ajaxSuccessField: '',
    // 某些公司接口http code一直返回200，而在response中提示错误。所以这里可以配置ajaxSuccessField和ajaxSuccessCode，如果response[ajaxSuccessField]不是ajaxSuccessCode配置的，这些接口将进行上报，如：
    //{
    //  "errno": 404,
    //  "errmsg": "接口不存在",
    //  "data": [],
    // }
    // 比如可设置
    // ajaxSuccessField: 'errno',
    // ajaxSuccessCode: 10000,
    ajaxSuccessCode: 0,

    // 用户自定义的其他的需要上报的数据
    customData: {},
});
monitor.init();

// 浏览器：
const monitor = new window.Monitor({
    // 接口返回的code的字段名称
    ajaxSuccessField: 'errno',
    ajaxSuccessCode: 200
});
monitor.init();

后端接口(nodejs版)

后端接口例子请参考report.js

Options

参数 | 解释 | 默认值 -|-|- reportUrl | 上报地址 | http://localhost:8080/ projectName | 监控的项目名称 | myProject timeout | 超时设置(包含请求超时、ajax超时等)，单位毫秒。请求时间超过此值的请求将上报 | 3000 maxSize | 大小设置，单位字节B。资源大小超过此值的请求将上报 | 300 * 1024 ajaxSuccessField | 接口返回的code的字段名称 | '' ajaxSuccessCode | 接口返回的code的值 | 0 customData | 用户自定义的其他的需要上报的数据 | {}