vue-exception-captor

1.0.8 • Public • Published

vue-exception-captor

本项目以Vue插件方式应用与Vue工程中,用于捕获Vue前端工程中出现的全局异常、Vue组件异常、Promise异常,并支持HTTP接口方式上送到后台服务进行分析统计。异常捕获主要来自以下几个钩子函数:

  1. Vue.config.errorHandle
    捕获Vue组件异常
    
  2. window.onerror
    1. Vue组件内的同步异常,无法被window.onerror捕获
    2. Vue组件内部的定时器异常,可以被window.onerror捕获
    3. window.onerror不能捕获promise异常
    
  3. 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,
})
  1. productName:产品名字,用于在异常分析平台分类,默认为unknown
  2. username:用于标识异常来自哪个用户,默认为unknown
  3. reportUrl:上报异常的Http接口Url
  4. disabled:是否停止上报,默认为false
  5. console:是否开启控制台打印,默认为false

安装完插件后,会向vue注册两个属性

  1. Vue.prototype.$exceptionCaptor

    在Vue实例中使用该方法设置username,使得上报的异常可以标识来自哪个用户(只需要在用户名变化后调用一次,后续所有上报的异常均使用该用户名)

    this.$exceptionCaptor.setUserName(userName)
  2. Vue.prototype.$reportException

    在Vue实例中使用以下方法上报异常

    1. type:异常类型,vue.errorHandle、window.onerror、window.onunhandledrejection或者自定义的类型
    2. error:Error对象实例
    3. message:描述
    4. level:异常等级
    this.$reportException(type,error,message,level)

Package Sidebar

Install

npm i vue-exception-captor

Weekly Downloads

1

Version

1.0.8

License

MIT

Unpacked Size

12 kB

Total Files

5

Last publish

Collaborators

  • johncao