antBug 前端异常上报组件

antBug是一个前端模块化的异常上报组件,可以上报前端的js执行错误,页面中的文件加载异常以及网络请求异常 用户还可以自定义异常上报

组件初始化

在页面引入该组件,然后在页面进行初始化即可

antBug.init({
	appVersion: "3.1",//app版本
});

配置项

当前页最大错误收集量 antBug.maxErrorNum

为了不影响原有的业务性能,系统默认最多搜集当前页的20个异常,超过则忽略,可以通过此项合理调整 例如设置为当前页最多收集10个异常

antBug.maxErrorNum = 10;

异常上报服务器 antBug.SERVER_HOST 异常上报服务器地址

为了不影响现有的技术栈,所以本组件不提供服务器端,异常上报地址您可以自由设置

antBug.SERVER_HOST = "http://www.baidu.com";

识别id antBug.APP_ID

异常上报的唯一识别ID,可通过此ID来区分数据来源及分类,默认为default 如果有多个项目上报数据时,请设置此项作为区分

antBug.APP_ID = "abcd123456";

debug模式 antBug.DEBUG

此项为true时会在控制台输出上报的参数以及服务器返回的结果,默认为false,生产环境建议设置为false

antBug.DEBUG = true;

自动启动异常上报时间 antBug.autoWaittime

现在系统改为在页面完成后再上传bug,防止跟页面其他业务竞争资源.此项为页面加载完成后启动异常上报的等待时间

antBug.autoWaittime = 2000;

设置扩展参数 antBug.setExt(data)

设置自定义扩展参数到服务器

antBug.setExt({test:"test"});

其他可选配置项:

_self.messageContent = {
    notifierVersion: _self.APIVERSION,//插件版本号
    userAgent: window.navigator.userAgent,//用户agent头
    locale: window.navigator.language || window.navigator.userLanguage,//语言
    url: window.location.href,//接口地址
    appId: ant.APP_ID,//识别id
    title: documents.title,//当前页面标题
    time: (new Date).getTime(),
    appVersion: "",//app版本
    message: "",//错误信息
    fileName: "",//文件名称
    lineNumber: "",//第几行
    columnNumber: "",//第几列
    stacktrace: "",//错误详情
    type: "",//错误类型 可选值 resourceError,httpError,uncaughtError
    deviceType: "web",//设备类型
    osVersion: "",//系统版本
    ext: {},//扩展传参
    breadcrumbs:"",//错误记录
};

如果有自定义的需要传递的参数可以在ext中进行传递 异常类型分为:resourceError,httpError,uncaughtError

启动异常上报 antBug.start()

为了不跟项目竞争系统资源,所以现在改为启动异常上报时才上报异常.启动之前收到的异常不会丢失

antBug.start({test:"test"});

resourceError 资源加载异常错误

当页面中的资源加载异常时会触发此错误类型 例如页面中的图片加载错误 如果不需要监听图片加载错误,可以设置antBug.collectResourceError = false;

antBug.collectResourceError = false;

httpError网络请求错误

页面中的ajax请求错误时会上报此错误类型 如果不需要上报此错误可以设置antBug.collectHttpError = false;

antBug.collectHttpError = false;

uncaughtError js执行错误错误

页面中的JS执行出现问题时会上报此错误类型

自定义上报错误 antBug.error(errorContent)

用户通过此函数可以上传自定义的错误

DEMO

 antBug.init({
    appVersion: "3.1",//app版本
  });
 antBug.start();//启动异常上报
 antBug.collectHttpError = false;
 antBug.collectResourceError = true;
 antBug.SERVER_HOST = "http://www.baidu.com";