监控 Vue 项目控制台报错发送给后台打印

由于遇到线上项目出现未知错误的问题。为了排除错误,需要确定是否是前端有语法错误。所以这里实现了一个将错误日志发送给后台打印日志的功能。

index.js

首先在前端入口文件进行 window 和 Vue 的错误监听,如果有错误发送错误信息到 node 中间层。

Vue.config.errorHandler = function (err) {
  post('error', {
    data: {
      error: err.stack
    }
  });
};

window.onerror = function(message, source, lineno, colno, error) {
  post('error', {
    data: {
      error: error.stack
    }
  });
};

window.addEventListener('error', (event) => {
  post('error', {
    data: {
      error: event.error.stack
    }
  });
});

error.js

在 node 后端层创建接口用于打印错误日志。为了符合前端 ajax 规范所以请求返回了一个 { code: 1 }

export default {

  needLogin: false,

  async handler(ctx) {
    const params = ctx.request.body.error;
    console.error(params)
    ctx.ajax({
        code: 1
    });
  }
}

注意

本文作用于工作项目中,仅供借鉴

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 转载 :OpenDiggawesome-github-vue 是由OpenDigg整理并维护的Vue相关开源项目库...
    果汁密码阅读 23,212评论 8 124
  • 一 陆青玫最近中午一直在吃麻辣烫,吃麻辣烫不是重点,重点是偶遇小哥哥。 陆青玫干的是守株待兔的大事,可是陪吃了五天...
    幼韶阅读 890评论 2 5