vue-exception-captor
v1.0.8
Published
用于捕获Vue前端工程中的全局异常、Promise异常,并支持HTTP模式上报到后台存储
Downloads
2
Maintainers
Readme
vue-exception-captor
本项目以Vue插件方式应用与Vue工程中,用于捕获Vue前端工程中出现的全局异常、Vue组件异常、Promise异常,并支持HTTP接口方式上送到后台服务进行分析统计。异常捕获主要来自以下几个钩子函数:
- Vue.config.errorHandle
捕获Vue组件异常
- window.onerror
1. Vue组件内的同步异常,无法被window.onerror捕获 2. Vue组件内部的定时器异常,可以被window.onerror捕获 3. window.onerror不能捕获promise异常
- window.onunhandledrejection
捕获Promise异常
使用说明
npm install vue-exception-captor
import vue-exception-captor from "vue-exception-captor"
Vue.use(vue-exception-captor,{
productName: 'psdc',
username:'testuser',
reportUrl: '/event-tracking/exceptions',
disabled: process.env.NODE_ENV !== 'production',
console: true,
})
- productName:产品名字,用于在异常分析平台分类,默认为unknown
- username:用于标识异常来自哪个用户,默认为unknown
- reportUrl:上报异常的Http接口Url
- disabled:是否停止上报,默认为false
- console:是否开启控制台打印,默认为false
安装完插件后,会向vue注册两个属性
Vue.prototype.$exceptionCaptor
在Vue实例中使用该方法设置username,使得上报的异常可以标识来自哪个用户(只需要在用户名变化后调用一次,后续所有上报的异常均使用该用户名)
this.$exceptionCaptor.setUserName(userName)
Vue.prototype.$reportException
在Vue实例中使用以下方法上报异常
- type:异常类型,vue.errorHandle、window.onerror、window.onunhandledrejection或者自定义的类型
- error:Error对象实例
- message:描述
- level:异常等级
this.$reportException(type,error,message,level)