捕获所有JavaScript错误并将其发送到服务器

我想知道是否有人有全局处理JavaScript错误并将它们从客户端浏览器发送到服务器的经验。

我想我的观点很清楚，我想知道客户端发生的每一个异常、错误、编译错误等，并将它们发送给服务器报告它们。

我主要使用MooTools和head.js(用于JS端)和Django用于服务器端。

93471 次浏览
小开

我会看看window.onerror

例子:

window.onerror = function(message, url, lineNumber) {
//save error and send to server for example.
return true;
};

请记住，返回true将阻止触发默认处理程序，返回false将让默认处理程序运行。

小开

如果你的网站使用谷歌分析，你可以做我做的:

window.onerror = function(message, source, lineno, colno, error) {
if (error) message = error.stack;
ga('send', 'event', 'window.onerror', message, navigator.userAgent);
}

上面代码的一些注释:

  • 对于现代浏览器，记录完整的堆栈跟踪。
  • 对于没有捕获堆栈跟踪的旧浏览器，则记录错误消息。(根据我的经验，主要是早期的iOS版本)。
  • 用户的浏览器版本也会被记录下来，因此您可以看到哪个OS/浏览器版本抛出了哪些错误。这简化了错误的优先级和测试。
  • 这段代码工作，如果你使用谷歌分析与" analysis .js"， 像这样。如果你用"gtag.js"代替像这样，你需要调整函数的最后一行。详情请看这里。

代码就绪后，你可以这样查看用户的Javascript错误:

  1. 在谷歌分析中，单击Behavior部分，然后单击Top Events报告。
  2. 您将得到一个事件类别列表。单击列表中的window.onerror。
  3. 您将看到Javascript堆栈跟踪和错误消息的列表。通过单击Secondary dimension按钮并在出现的文本框中输入Event Label，为用户的OS/浏览器版本的报告添加一列。
  4. 报告如下面的截图所示。
  5. 为了将操作系统/浏览器字符串转换为更便于人类阅读的描述，我将它们复制粘贴到https://developers.whatismybrowser.com/useragents/parse/中

enter image description here

小开

不要尝试使用第三方服务，而是尝试自己的服务。

错误处理程序可以捕获以下场景:

  1. 无法捕获Uncaught TypeError
  2. 无法捕获未捕获的ReferenceError，例如:var.click()
  3. TypeError可以被捕获
  4. 可以捕获语法错误
  5. 可以捕获ReferenceError

捕捉Javascript错误:

window.addEventListener('error', function (e) {
//It Will handle JS errors
})

捕获AngularJS错误:

app.config(function ($provide) {
$provide.decorator('$exceptionHandler', function ($delegate) {
return function (exception, cause) {
//It will handle AngualarJS errors
}
})
})

提交答案