碰到一个有趣的小问题,setTimeout、ajax异步请求回调里的代码发生了异常,try catch却没有捕获到。
function test(){
try {
setTimeout(function(){
throw 'error';
}, 1);
} catch (e) {
console.log("try catch里捕获的异常" + e);
}
}
function testAjax(){
try {
$.ajax({
url: "xxx",
cache: false,
success: function(data){
throw 'error';
}
});
} catch (e) {
console.log("try catch里捕获的异常" + e);
}
}
运行结果如下:
那么如何捕获这里面的异常呢?总不可能在每个延时函数里再增加异常捕获。
最终找到了:window.onerror
// 注意事项:js中对象初始化慢于方法,在方法调用时最好加个延迟,让window.onerror加载完毕。
window.onerror = function(message, source, lineno, colno, error){
// message:错误消息(字符串)。在HTML οnerrοr=""处理程序event(sic!)中可用。
// source:引发错误的脚本的URL(字符串)
// lineno:发生错误的行号(数值)
// colno:发生错误的行的列号(数值)
// error:错误对象(对象)
var message = [
'Message: ' + msg,
'URL: ' + url,
'Line: ' + lineNo,
'Column: ' + columnNo,
'Error object: ' + JSON.stringify(error)
].join(' - ');
console.log(message);
// 当函数返回true时,这可以防止触发默认事件处理程序(就是浏览器控制台打印红色的异常信息)。
return true;
};
更详细的用法,请参考以下文章。
前端代码异常监控方案window.onerror
window.onerror的总结
前端代码异常监控之 - window.onerror