前端代码
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="utf-8" %>
<%@include file="../base_path.jsp" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta http-equiv="Cache-Control" content="no-cache"/>
<meta http-equiv="Expires" content="0">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="description" content="">
<link rel="stylesheet" type="text/css" href="<%=basePath%>/lib/bootstrap/3.3.7/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" media="screen" href="<%=basePath%>/lib/jqgrid/5.2.1/css/ui.jqgrid-bootstrap.css"/>
<link rel="stylesheet" type="text/css" media="screen" href="<%=basePath%>/lib/lobibox/css/lobibox.min.css"/>
<link rel="stylesheet" type="text/css" media="screen" href="<%=basePath%>/css/mycss.css"/>
<title>日志监控</title>
<%--<script src="../../boot.js"></script>--%>
</head>
<body>
<div class="navbar-fixed-top">
<div class="breadcrumb">
<span>系统监控</span><span class="glyphicon glyphicon-menu-right"></span>
<span class="active">日志监控</span>
</div>
</div>
<div id="log-container" style="height: 700px; overflow-y: auto; background: #333; padding: 50px 10px 10px 10px;">
<div>
</div>
</div>
<div>
<div style="width: 80px;height: 40px;line-height: 40px;font-size: 20px;background: #333;color: #FFF;text-align: center;border-radius: 15px;margin-left: 50%;margin-top: 30px;cursor: pointer;"
onclick="clearContext()">清屏</div>
</div>
</body>
<script type="text/javascript" src="<%=basePath%>/lib/jquery/3.2.1/jquery.min.js"></script>
<script>
// 控制是否滚动显示日志
var checked = true;
function onValueChanged(e) {
checked = this.getChecked();
}
$(document).ready(function() {
var hostport=document.location.host;
// 指定websocket路径,此地址建议根据用js动态获取
//不要忘了将请求放开拦截之后会报错。如本项目中用到shiro如果拦截了就会404，mvc中配置错误会302；
var websocket = new WebSocket("ws://" + hostport + "/dprsmgr/log");//localhost:8080/log');
websocket.onmessage = function(event) {
// 接收服务端的实时日志并添加到HTML页面中（error显示红色）
if (event.data.search("ERROR") != -1) {
$("#log-container div").append(event.data).css("color", "#AA0000");
} else {
$("#log-container div").append(event.data).css("color", "#aaa");
}
// 是否滚动
if (checked) {
// 滚动条滚动到最低部
$("#log-container").scrollTop($("#log-container div").height() - $("#log-container").height());
}
};
});
</script>
</body>
</html>
后台代码
pom
<!-- https://mvnrepository.com/artifact/javax.websocket/javax.websocket-api -->
<dependency>
<groupId>javax.websocket</groupId>
<artifactId>javax.websocket-api</artifactId>
<version>1.1</version>
<scope>provided</scope>
</dependency>
WebSocketConfig
package com.deepai.dprsmgr.websocket;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.server.standard.ServerEndpointExporter;
@Configuration
public class WebSocketConfig {
@Bean
public ServerEndpointExporter serverEndpointExporter() {
return new ServerEndpointExporter();
}
}
LogWebsocketHandle
package com.deepai.dprsmgr.websocket;
import java.io.InputStream;
import java.io.PipedReader;
import java.io.PipedWriter;
import java.io.Writer;
import java.net.InetAddress;
import com.deepai.dprsmgr.monitor.thread.LogThread;
import org.apache.log4j.Appender;
import org.apache.log4j.Logger;
import org.apache.log4j.MDC;
import org.apache.log4j.WriterAppender;
import org.springframework.context.annotation.ComponentScan;
import javax.websocket.OnClose;
import javax.websocket.OnError;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;
@ServerEndpoint("/log")
@ComponentScan
public class LogWebsocketHandle {
private Process process;
private InputStream inputStream;
/**
* WebSocket请求开启
*/
@OnOpen
public void onOpen(Session session) {
try {
process = Runtime.getRuntime().exec("tail -500f /usr/local/apache-tomcat-8.0.51/logs/catalina.out");
inputStream = process.getInputStream();
LogThread thread = new LogThread(inputStream,session);
thread.start();
} catch (Exception ex) {
ex.printStackTrace();
}
}
/**
* WebSocket请求关闭，关闭请求时调用此方法，关闭流
*/
@OnClose
public void onClose() {
try {
if(inputStream != null) {
inputStream.close();
}
} catch (Exception ex) {
ex.printStackTrace();
}
try {
if(process != null) {
process.destroy();
}
} catch (Exception ex) {
ex.printStackTrace();
}
}
@OnError
public void onError(Throwable thr) {
thr.printStackTrace();
}
}
LogThread
package com.deepai.dprsmgr.monitor.thread;
import javax.websocket.Session;
import java.io.*;
/**
* 新线程
*/
public class LogThread extends Thread {
private BufferedReader reader;
private Session session;
public LogThread(InputStream in, Session session) {
this.reader = new BufferedReader(new InputStreamReader(in));
this.session = session;
}
@Override
public void run() {
String line;
try {
while((line = reader.readLine()) != null) {
session.getBasicRemote().sendText(line + "<br>");
}
} catch (IOException e) {
e.printStackTrace();
}
}
}