以编程方式捕获 Chrome Async Javascript 堆栈跟踪



我一直在努力尝试为仅在Chrome上运行的Web应用程序添加一些更好的错误日志记录。从本质上讲,我希望能够捕获和存储堆栈跟踪。对于同步代码,这工作正常,但对于异步代码,我遇到了一些奇怪的事情。从本质上讲,Chrome 似乎会记录其他信息作为其异步堆栈跟踪功能的一部分,但我一直无法弄清楚如何捕获它。

要在 Chrome 浏览器控制台中运行的代码:

let e;
let a = () => Promise.resolve(null)
.then(() => (null).foo)
.catch(err => {
console.info(err); 
console.error(err); 
e = err;
})
let b = () => a();
let c = () => b();
c();

输出:

(info)
TypeError: Cannot read property 'foo' of null
at <anonymous>:3:20
(error, after expanding)
TypeError: Cannot read property 'foo' of null
at <anonymous>:3:20
(anonymous) @ VM1963:6
Promise.catch (async)
a @ VM1963:4
b @ VM1963:9
c @ VM1963:10
(anonymous) @ VM1963:11

所以console.error给了我一个堆栈跟踪,一直串通调用堆栈,大概是通过某种形式的Chrome引擎魔术。console.info给了我存储在err上的实际堆栈跟踪。如果在完成所有这些操作后,我尝试读取e的值,它的堆栈是我从console.info语句中得到的两行,而不是console.error语句。

我要问的是,有没有办法捕获和存储Chrome在我调用console.error时生成和使用的异步堆栈跟踪?

console.error()似乎为了方便而调用console.trace()

看起来脚本不能将堆栈跟踪作为字符串以外的任何内容获取。例如,该字符串可以与err.stack一起使用。MDN 有Errorstack属性的文档。它不是规范的一部分,但似乎在所有平台上都受支持。

最新更新