一个记录到我们后端的 JavaScript 前端日志系统？

Posted 2023-02-26

【中文标题】一个记录到我们后端的 JavaScript 前端日志系统？

【英文标题】：A JavaScript frontend logging system that logs to our backend?

【发布时间】：2011-06-29 08:55:42

【问题描述】：

我们为我们的服务器端服务建立了一个日志系统。具体来说，我们的 Django 项目大量使用 Python 日志记录模块，因此对 logger.info()、logger.warn() 和 logger.error() 的调用会被我们的集中式日志记录系统接收。

我想在我们的前端有一个等效的，我有一些想法：

会有某种通过 javascript 公开的自定义日志对象，它会通过 XmlHttpRequest 向后端发送消息。

我想在客户端设置相同的日志记录级别：debug、info、warning 和 error。

当我们在本地开发（调试模式）时，我希望将这些日志消息通过console.log() 记录到浏览器/Firebug 控制台。

在生产中，debug 消息应该被完全丢弃。

我记得看到过一种捕获所有未捕获的 JavaScript 异常的方法，因此这些异常应该记录在 error 级别。

我们已经在使用Google Analytics event tracking，如果我们创建的任何系统都能以某种方式与之结合，那就太好了。

这是个好主意吗？你会怎么做？有现成的解决方案吗？

（FWIW，我们在前端使用 jQuery。）

更新：此处为简化问题：https://***.com/questions/1423267/are-there-any-logging-frameworks-for-javascript

【问题讨论】：

我无法决定这个问题的好标题。随时改进。

如果客户端可以“填充”服务器端日志，这是否意味着互联网上的任何人（假设它是一个 web 应用程序）都可以通过发送 AJAX 垃圾邮件来淹没服务器端日志？您可能希望对谁可以将“东西”记录到我们的系统日志中添加一些安全限制...

@DashK – 是的，但这对我们来说不值得。我们还记录所有断开的链接，因此任何人都可以通过敲击我们网站上不存在的路径来淹没我们的日志。但我们是好人，目前还不是真正的 DoS 目标 :)

我在 XMPP 应用程序问题报告项目中做了类似的事情。我们发现，如果应用程序运行了很长时间，日志确实会堵塞日志。 （我们不做即时报告。我们只在客户想要报告问题时发送数据 - 考虑一下？）如果我要再做一次，我将使用一些常量来替换整个日志消息. （例如，“用户进入了一个聊天室。房间名称是：0”将在日志中记录为“#1 0”。这大大减少了客户端和服务器之间传输的数据大小。我们使用 log4javascript。

欢迎尝试Usersnap。阅读更多来自 Mozilla Hacks 的this article

【参考方案1】：

这里的想法听起来不错。请注意您正在寻找记录客户端并拥有它的确切内容。

我建议使用log4javascript 进行日志记录。 log4 api 非常简单。

【参考方案2】：

这里是another question 从这里就这个问题。

一些建议是：log4js、log4javascript 和 Blackbird。

FWIW，log4js 是那里公认的答案。我没有使用任何这些平台的经验，所以我不能真正推荐其中一个。

【讨论】：

有用，但问题 5 和 6 呢？

@a 付费书呆子 - 我实际上并不使用 Java 或 JavaScript，所以我对这些问题并不十分熟悉。我刚刚提到了这些其他选项，因为我最近在被要求研究一种将 JavaScript 日志记录与我们的集中式日志记录解决方案（我们目前正在研究）集成的方法时遇到了它们。我还没有真正开始用 JavaScript 做任何事情。

【参考方案3】：

首先，我编写并维护了log4javascript，因此我提前声明了我的兴趣。我也每天在工作中使用它，所以我作为用户对它有一些体验。以下是我将如何处理您的问题，特别是与 log4javascript 相关的问题：

使用 log4javascript 的 AjaxAppender 进行服务器日志记录；

debug、info、warning和error都支持，还有trace和fatal；

使用BrowserConsoleAppender 登录FireBug 或本机浏览器控制台；

如果您不想从生产代码中删除所有调试日志记录调用，您可以调整记录器的阈值（例如，使用 log.setLevel(log4javascript.Level.ERROR)，这将抑制所有优先级低于 @ 的日志调用987654336@)。如果您想禁止所有日志记录调用，可以在生产代码中添加stub version of log4javascript。

您需要使用window.onerror 编写一些代码来执行此操作。类似window.onerror = function(msg, file, line) log.error("Error in " + file + " on line " + line + ": " + msg);

我不确定您希望如何与 Google Analytics（分析）结合使用。 log4javascript 没有特别支持它。

【讨论】：

实际上msg、file和line通常不足以仅基于日志进行调试。你真正需要发送的是堆栈。目前它是第五个参数，但不是每个浏览器都支持，所以你需要创建一个新的错误，覆盖消息、文件等......如果浏览器支持堆栈，则发送它的堆栈

注意：似乎新的错误不会包含堆栈：github.com/stacktracejs/stacktrace.js/issues/26 所以恐怕旧浏览器中没有解决方法，但尚未测试。