美文网首页
报错监控-监控Promise错误

报错监控-监控Promise错误

作者: jyKid | 来源:发表于2019-07-12 17:26 被阅读0次

上次我们聊过了前端监控 JS 执行错误和第三方资源加载异常的监控,那么这次来聊聊如何捕获 Promise 错误。

首先先安利下自己做的报错监控的项目 FE-Monitor 欢迎 issue 和 star 。

Promise 在前端中的使用已经非常普遍了,但是许多开发者或许习惯了链式调用却忘了捕获 Promise 的错误了。

例如:

function forgetCatchError () {
  async()
    .then(() => {
      // code..
    })
    .then(() => console.log('forget catch error!'));
}

上面的示例代码中 async() 中和后续的两个 then 中的代码如果出错或者 reject ,错误没有得到处理。

在没有使用 catch 方法指定错误处理的回调函数,Promise 对象抛出的错误不会传递到外层代码,即不会有任何反应。当promise被 reject 并且错误信息没有被处理的时候,会抛出 unhandledrejection,这个错误不会被 window.onerroraddEventListener("error") 所监听到。

使用 unhandledrejection

unhandledrejection 事件进行监听即可捕捉到未被 catch 的 Promise 错误。

window.addEventListener("unhandledrejection", err => {
  console.log(err.reason)

  err.preventDefault();
}, false);

 // 或者
 window.onunhandledrejection = function(err) {
  console.log(err.reason);
  return true;
}

addEventListener 中调用 event 的 preventDefault() 可以让 Promise 的错误不抛送到控制台,在 onunhandledrejection 中则可以使用 return true 来达到相同的效果。

相关文章

  • 报错监控-监控Promise错误

    上次我们聊过了前端监控 JS 执行错误和第三方资源加载异常的监控,那么这次来聊聊如何捕获 Promise 错误。 ...

  • 页面监控之监控页面报错

    监控js报错 错误示例 监控js报错的同时监控资源加载失败,即加上捕获选项即可 错误示例 监听ajax请求 监听未...

  • 前端监控体系建设

    前端监控体系主要分为错误监控、性能监控、业务监控及安全监控三个方面。 一、错误监控 (一)监控范围 js语法错误、...

  • window.onerror

    在打点系统中会监控页面的运行时报错,在上报错误时会使用window.onerror来进行全局监控 但是由于浏览器安...

  • 小公司的前端质量保障体系

    生产阶段 1、轮询首页访问 2、线上的js报错追踪 3、页面加载时间监控 4、错误日志监控 5、用户反馈 线上的j...

  • Js error 监控

    一个全局监控js报错的模块,前端需要监控的有三点:1.js语法错误2.ajax请求3.静态资源加载错误 js语法错...

  • sentry搭建错误监控系统(一)

    一、 前言 很多公司都会搭建自己的错误监控系统。我自己想尝试搭建监控系统,源于我们公司内部小程序线上报错,不能及时...

  • Fundebug前端JavaScript插件更新至1.2.0

    摘要: Fundebug的前端JavaScript错误监控插件更新至1.2.0:支持监控WebSocket连接错误...

  • Vue.js@2.6.10更新内置错误处机制,Fundebug同

    摘要: Fundebug 的 JavaScript 错误监控插件同步支持 Vue.js 异步错误监控。 Vue.j...

  • 前端埋点-报错监控

    说起埋点又到了谈起前端项目中数据收集与监控,那么今天来简单的聊下前端报错监控的埋点。 首先先安利下自己做的报错监控...

网友评论

      本文标题:报错监控-监控Promise错误

      本文链接:https://www.haomeiwen.com/subject/kspykctx.html