错误报告

错误报告的工作原理、哪些内容会发送到 'Errors' 标签页,以及如何手动报告错误和异常

错误报告

错误报告对于监控应用的稳定性、提前发现回归问题以及了解哪些问题对用户来说发生得最频繁都非常重要。默认情况下,任何未捕获的异常都会记录在 ‘Errors’ 标签页下:

Errors Tab

此外,记录的错误还会出现在会话回放中 DevTools 的 ‘Console’ 标签页下:

Exceptions Tab

OpenReplay 跟踪器支持记录 3 种类型的错误:

以上所有类型都可以使用单个方法进行报告:

tracker.handleError(error, metaObject); // metaObject is optional and is a flat object

让我们来看一下每种错误类型的示例:

默认情况下,已捕获的异常不会记录到 ‘Console’ 标签页。为了报告错误,我们可以这样做:

try {
    // application code
}
catch(err) {
    // application code that handles the error
    tracker.handleError(error, metaObject); // metaObject is optional and is a flat object
}

被拒绝的 Promise (PromiseRejectionEvent)

Section titled 被拒绝的 Promise (PromiseRejectionEvent)

如果某个 Promise 被拒绝,而我们希望将该错误报告给 OpenReplay,可以这样做:

function myFunc() {
    doSomeAsyncStuff()
    .then((result) => {
        // application code
    })
    .catch(promiseRejectionErr => {
        // application code to handle the error
        tracker.handleError(promiseRejectionErr, metaObject); // metaObject is optional and is a flat object     
    })
}

此示例将展示如何在 <img> 元素未能加载时报告错误:

<img id="myImg" src="image.gif">
<p id="demo"></p>
document.getElementById("myImg").addEventListener("error", myFunction);

function myFunction(errorEvent) {
  document.getElementById("demo").innerHTML = "The image could not be loaded.";
  tracker.handleError(errorEvent, { context: "demo" });
}

如果您对此流程有任何疑问,欢迎通过我们的 Slack 联系我们,或查看我们的 论坛