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

Oli*_*dot 222 javascript error-handling client-side

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

我认为我的观点很清楚,我想知道客户端发生的每个异常,错误,编译错误等,并将它们发送到服务器进行报告.

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

Mik*_*wis 313

我看看window.onerror

例:

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

请记住,返回true将阻止触发默认处理程序,返回false将使默认处理程序运行.

  • 是的,我喜欢它说**一些/很多**,非常具有描述性 - 感谢Mozilla. (85认同)
  • 注意,Mozilla建议:'注意,一些/很多错误事件不会触发window.onerror,你必须专门听它们. (17认同)
  • 您可能希望在运行其他任何内容之前分配window.onerror.所以无论你想把它放在哪里,只要确保它在你的任何其他js代码/文件之前运行. (9认同)
  • Mozilla暴露了GlobalEventHandlers.onerror:https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror (5认同)
  • 如何触发_does_侦听的错误? (3认同)
  • 如果处理 window.onerror 的代码本身抛出错误会发生什么。有没有无限循环的可能? (3认同)
  • @MartinBrown 在 Chrome 和 Firefox 中进行的简短测试似乎表明,错误处理期间的错误不会被递归处理,从而防止无限循环,假设所有错误都在同一事件循环任务期间抛出(即没有 `Promise`、`setTimeout`、` setInterval`,或其他宏/微任务调用):`var errNum = 0; window.addEventListener('error', () => { console.log(`Error #${++errNum}`); throw new Error(); }); setTimeout(() => {抛出新的Error()}, 100);` (2认同)

Tar*_*rek 17

我最近测试了Sentry的生产,它工作正常(JS和其他语言,如PHP)

1-它是开源的(您可以将它安装在您自己的服务器上)2-您可以使用免费计划(每天100份报告)

或者将其安装在您的服务器上:github.com/getsentry

  • 似乎不再是开源,所有选项都支付? (7认同)
  • @DavidCumps他们仍然提供免费服务(试用版),但你只能获得7天的bug历史,或者你可以在自己的服务器上安装它自开源(https://github.com/getsentry) (4认同)
  • Sentry源代码在[github]上(https://github.com/getsentry/sentry) (3认同)

Mar*_*der 10

如果您的网站使用的是Google Analytics,您可以执行以下操作:

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

关于上面代码的一些评论:

  • 对于现代浏览器,将记录完整堆栈跟踪.
  • 对于不捕获堆栈跟踪的旧浏览器,将记录错误消息.(根据我的经验,大多数早期的iOS版本).
  • 还会记录用户的浏览器版本,因此您可以查看哪些操作系统/浏览器版本正在抛出哪些错误.这简化了错误优先级和测试.
  • 如果你使用谷歌分析"的analytics.js",此代码的工作是这样.如果你使用"gtag.js",就像这样,你需要调整函数的最后一行.详情请见此处.

代码到位后,您就可以查看用户的Javascript错误:

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

在此输入图像描述

  • 这并没有捕获所有错误,只是尝试捕获块,虽然这是一个很酷的解释,我不认为你应该得到downvotes. (3认同)