报错监控-监控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.onerror
和 addEventListener("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
来达到相同的效果。