我正在使用log4j记录我的数据。我希望能够在浏览器中与Web应用程序一起实时查看日志文件。有诸如Chainsaw之类的独立工具非常好,但是它们不能满足在浏览器中实时查看日志的目的。
有人可以帮我吗?
一个简单的例子是:
Servlet(根据需要更改日志文件的路径):
@WebServlet(name = "Log", urlPatterns = { "/log" }) public class LogServlet extends HttpServlet { private static final long serialVersionUID = 7503953988166684851L; public LogServlet() { super(); } @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { Path path = FileSystems.getDefault() .getPath("/path/to/tomcat/logs", "catalina.out"); StringBuilder logContent = new StringBuilder(); logContent.append("<pre>"); try (BufferedReader reader = Files.newBufferedReader(path, StandardCharsets.UTF_8);) { String line = null; while ((line = reader.readLine()) != null) { logContent.append(line).append("<br/>"); } } catch (IOException x) { // Take care of that } logContent.append("</pre>"); resp.getWriter().print(logContent.toString()); } @Override public void init(ServletConfig servletConfig) throws ServletException { super.init(servletConfig); } }
HTML页面:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Log viewer</title> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script>window.jQuery || document.write(unescape('%3Cscript src="http://jquery.com/jquery-wp-content/themes/jquery/js/jquery-1.10.2.min.js"%3E%3C/script%3E')) </script> <script type="text/javascript"> var logging = false; function refreshLog() { if (logging) { $.get('/log', function(data) { $('#log').html(data); }); } if (logging) { setTimeout(function() { refreshLog() }, 5000); } } function toggleLogs() { if (logging) { logging = false; $("#tog").val("Start"); } else { logging = true; $("#tog").val("Stop"); refreshLog(); } } </script> </head> <body style="width: 100%; padding: 0; margin: 0"> <input type="button" id="tog" onclick="toggleLogs()" value="Start" /> <div id="log" style="width: 100%; padding: 0; margin: 0"></div> </body> </html>