捕获所有 JavaScript 错误并将它们发送到服务器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5328154/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Catch all JavaScript errors and send them to server
提问by Olivier Girardot
I wondered if anyone had experience in handling JavaScript errors globally and send them from the client browser to a server.
我想知道是否有人在全局处理 JavaScript 错误并将它们从客户端浏览器发送到服务器方面有经验。
I think my point is quite clear, I want to know every exception, error, compilation error, etc. that happens on the client side and send them to the server to report them.
我想我的观点很清楚，我想知道客户端发生的每个异常、错误、编译错误等，并将它们发送到服务器报告它们。
I'm mainly using MooTools and head.js(for the JS side) and Django for the server side.
我主要使用 MooTools 和head.js（用于 JS 端）和 Django 用于服务器端。
采纳答案by Tarek
I recently tested Sentryon production and it works fine (JS and other languages like PHP)
我最近在生产中测试了Sentry，它工作正常（JS 和其他语言，如 PHP）
1- It's open source (You can install it on your own server) 2- You can use the free plan (100 reports / day)
1- 它是开源的（您可以将其安装在您自己的服务器上） 2- 您可以使用免费计划（每天 100 份报告）
Or install it on your server: github.com/getsentry
或者安装在你的服务器上：github.com/getsentry
回答by Mike Lewis
I'd check out window.onerror
我会检查window.onerror
Example:
例子：
window.onerror = function(message, url, lineNumber) {
//save error and send to server for example.
return true;
};
Keep in mind that returning true will prevent the firing of the default handler, and returning false will let the default handler run.
请记住，返回 true 将阻止触发默认处理程序，返回 false 将让默认处理程序运行。
回答by Martin Omander
If your website is using Google Analytics, you can do what I do:
如果您的网站使用的是 Google Analytics，您可以按照我的操作：
window.onerror = function(message, source, lineno, colno, error) {
if (error) message = error.stack;
ga('send', 'event', 'window.onerror', message, navigator.userAgent);
}
A few comments on the code above:
对上面代码的一些评论：
- For modern browsers, the full stack trace is logged.
- For older browsers that don't capture the stack trace, the error message is logged instead. (Mostly earlier iOS version in my experience).
- The user's browser version is also logged, so you can see which OS/browser versions are throwing which errors. That simplifies bug prioritization and testing.
- This code works if you use Google Analytics with "analytics.js", like this. If you are using "gtag.js" instead, like this, you need to tweak the last line of the function. See here for details.
- 对于现代浏览器，会记录完整的堆栈跟踪。
- 对于不捕获堆栈跟踪的旧浏览器，会记录错误消息。（根据我的经验，大多数是较早的 iOS 版本）。
- 还会记录用户的浏览器版本，因此您可以查看哪些操作系统/浏览器版本引发了哪些错误。这简化了错误优先级排序和测试。
- 如果您将 Google Analytics 与“analytics.js”一起使用，则此代码有效，如下所示。如果您使用的是“gtag.js”，就像这样，您需要调整函数的最后一行。有关详细信息，请参见此处。
Once the code is in place, this is how you view your users' Javascript errors:
代码到位后，您可以通过以下方式查看用户的 Javascript 错误：
- In Google Analytics, click the
Behaviorsection and then theTop Eventsreport. - You will get a list of Event Categories. Click
window.onerrorin the list. - You will see a list of Javascript stack traces and error messages. Add a column to the report for your users' OS/browser versions by clicking the
Secondary dimensionbutton and enteringEvent Labelin the textbox that appears. - The report will look like the screenshot below.
- To translate the OS/browser strings to more human-readable descriptions, I copy-paste them into https://developers.whatismybrowser.com/useragents/parse/
- 在 Google Analytics 中，点击该
Behavior部分，然后点击Top Events报告。 - 您将获得事件类别列表。
window.onerror在列表中单击。 - 您将看到 Javascript 堆栈跟踪和错误消息的列表。通过单击
Secondary dimension按钮并Event Label在出现的文本框中输入，为用户的操作系统/浏览器版本的报告添加一列。 - 该报告将类似于下面的屏幕截图。
- 要将操作系统/浏览器字符串转换为更易读的描述，我将它们复制粘贴到https://developers.whatismybrowser.com/useragents/parse/
回答by sam ruben
Don't try to use third party services instead try for your own.
不要尝试使用第三方服务，而是尝试自己的服务。
The Error Handlers can catch the below scenarios,
错误处理程序可以捕捉以下场景，
- Uncaught TypeError can't be captured
- Uncaught ReferenceError can't be captured eg: var.click()
- TypeError can be captured
- Syntax error can be captured
- ReferenceError can be captured
- 无法捕获未捕获的 TypeError
- 无法捕获未捕获的 ReferenceError 例如：var.click()
- TypeError 可以被捕获
- 可以捕获语法错误
- 可以捕获ReferenceError
To Catch Javascript Errors:
捕捉 Javascript 错误：
window.addEventListener('error', function (e) {
//It Will handle JS errors
})
To Capture AngularJS Errors:
捕获 AngularJS 错误：
app.config(function ($provide) {
$provide.decorator('$exceptionHandler', function ($delegate) {
return function (exception, cause) {
//It will handle AngualarJS errors
}
})
})
回答by LeeGee
回答by Ivan Kurmanov
Also, the http://jslogger.comservice can help with that:
此外，http: //jslogger.com服务可以提供帮助：
Log Javascript errors and events in the cloud
在云中记录 Javascript 错误和事件
from http://jslogger.com/features:
来自http://jslogger.com/features：
From now on you can spy on all the errors that break your site's user experience. Every Javascript error will be caught and brought to you for later debuging.
从现在开始，您可以监视破坏您网站用户体验的所有错误。每个 Javascript 错误都将被捕获并提供给您以供以后调试。
DISCLAIMER: not affiliated with the service/company.
免责声明：不隶属于服务/公司。
回答by Fizer Khan
You can try Atatus- It is a new JavaScript Error Tracking Service along with Real User Monitoring (RUM) for modern web apps.
您可以尝试Atatus- 它是一种新的 JavaScript 错误跟踪服务以及用于现代 Web 应用程序的真实用户监控 (RUM)。
We don't just capture the errors, but also the user events that triggered the error. This gives you steps to reproduce the error at your end.
我们不仅捕获错误，还捕获触发错误的用户事件。这为您提供了在最后重现错误的步骤。
Alongside error capturing, we also capture the page load time and showing it across different perspectives - Geo, Browser, Page Drill Down, Page Histogram, Ajax Monitoring and Transaction Monitoring.
除了错误捕获，我们还捕获页面加载时间并从不同的角度显示它 - 地理、浏览器、页面钻取、页面直方图、Ajax 监控和事务监控。
Docs available: https://www.atatus.com/docs
可用文档：https: //www.atatus.com/docs
Disclaimer: I am a web developer at Atatus.
免责声明：我是 Atatus 的 Web 开发人员。
回答by lillesand
You might wanna check out this new service, http://rescuejs.com/. https://bugsnag.com/
您可能想查看这项新服务，http://rescuejs.com/。https://bugsnag.com/
Lets you log all your javascript errors without writing server side code yourself. It also tracks browser versions and so on.
让您无需自己编写服务器端代码即可记录所有 javascript 错误。它还跟踪浏览器版本等。
I'm not sure I would consider them 100% "enterprise ready", but it's definitely worth checking out.
我不确定我是否会认为它们 100% 是“企业就绪”，但绝对值得一试。
