您的位置：首页 > 运维架构

【配置】SSM：WebSocket实时监控日志配置

2020-06-28 05:08 531 查看

提示：这里只是配置，没有对其实现和功能进行说明

主要是读取log.txt文件再通过websocket回显到前端
大家用的话注意文件路径就行了

依赖

<dependency>
<groupId>javax.websocket</groupId>
<artifactId>javax.websocket-api</artifactId>
<version>1.1</version>
<scope>provided</scope>
</dependency>

Log4j配置文件

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE log4j:configuration SYSTEM "log4j.dtd">

<log4j:configuration xmlns:log4j="http://jakarta.apache.org/log4j/">
<!--这是打印在控制台的-->
<appender name="STDOUT" class="org.apache.log4j.ConsoleAppender">
<param name="Encoding" value="UTF-8"/>
<layout class="org.apache.log4j.PatternLayout">
<param name="ConversionPattern" value="%-5p %d{MM-dd HH:mm:ss,SSS} %m  (%F:%L) \n"/>
</layout>
</appender>
<!--这是输出到文件的-->
<appender name="StreamOperateFile" class="org.apache.log4j.RollingFileAppender">
<param name="File" value="G:/Log/log.txt" />
<param name="Append" value="false"/>
<param name="MaxFileSize" value="10MB"/>
<param name="MaxBackupIndex" value="20"/>
<layout class="org.apache.log4j.PatternLayout">
<param name="ConversionPattern" value="%-5p %d{MM-dd HH:mm:ss,SSS} %m  (%F:%L) \n"/>
</layout>
</appender>
<logger name="java.sql">
<level value="info"/>
<appender-ref ref="StreamOperateFile" />
<appender-ref ref="STDOUT"/>
</logger>
<logger name="org.apache.ibatis">
<level value="info"/>
<appender-ref ref="StreamOperateFile" />
<appender-ref ref="STDOUT"/>
</logger>
<root>
<level value="debug"/>
<appender-ref ref="STDOUT"/>
<appender-ref ref="StreamOperateFile" />
</root>
<logger name="StreamOperateFile" additivity="false">
<level value="debug" />
<appender-ref ref="StreamOperateFile" />
<appender-ref ref="console" />
</logger>
</log4j:configuration>

java类

package com.live.component;

import org.springframework.stereotype.Component;

import javax.websocket.Session;
import java.io.*;
import java.util.concurrent.Executors;
import java.util.concurrent.ScheduledExecutorService;
import java.util.concurrent.TimeUnit;

@Component
public class ThreadLogComponent extends Thread {

private Session session;
//    private long lastTimeFileSize = 0;

public void read(Session session) {
this.session = session;
}

public void realtimeShowLog(File log) throws FileNotFoundException {
//指定文件可读可写
//        final RandomAccessFile randomAccessFile = new RandomAccessFile(log, "rw");
//启动一个线程每10秒钟读取新增的日志信息
InputStreamReader reader = new InputStreamReader(new FileInputStream(log));
BufferedReader bufferedReader = new BufferedReader(reader);
ScheduledExecutorService exec = Executors.newScheduledThreadPool(1);
exec.scheduleWithFixedDelay(() -> {
try {
//获得变化部分的
//                randomAccessFile.seek(lastTimeFileSize);
String tmp = "";
while ( (tmp = bufferedReader.readLine()) != null) {
session.getBasicRemote().sendText(tmp+"<br>");
//                    lastTimeFileSize = randomAccessFile.length();
}
} catch (IOException e) {
e.printStackTrace();
}
}, 0, 1, TimeUnit.SECONDS);

}

}

package com.live.component;
import org.springframework.stereotype.Component;

import javax.websocket.*;
import javax.websocket.server.ServerEndpoint;
import java.io.File;
import java.io.IOException;

@ServerEndpoint(value = "/log_websocket")
@Component
public class WebSocketController {

@OnOpen
public void openConnection(Session session) {
try {
String path = "G:/Log/log.txt";
File file = new File(path);
ThreadLogComponent thread = new ThreadLogComponent();
thread.read(session);
thread.realtimeShowLog(file);
} catch (IOException e) {
e.printStackTrace();
}
}

@OnClose
public void onClose() {
}

@OnError
public void error(Session session, Throwable error) {
error.printStackTrace();
}

/* @OnMessage
public void onMessage(Session session, String message) throws IOException {
System.out.println("收到的用户的消息:"+message);
session.getBasicRemote().sendText("发送给用户的消息");
}*/

}

HTML

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" type="text/css" th:href="@{/static/css/bootstrap.min.css}"/>
<link rel="stylesheet" type="text/css" th:href="@{/static/css/self/demo.css}"/>
<title>实时日志</title>
</head>

<body class="body-left-hidden">
<div id="log-container" style="height: 100vh; overflow-y: scroll; background: #333; color: #aaa; padding: 10px;">
<div>
</div>
</div>
</body>
<script th:src="@{/static/js/jquery-3.4.1.min.js}"></script>
<script th:src="@{/static/js/bootstrap.min.js}"></script>
<script th:src="@{/static/js/bootstrap.bundle.min.js}"></script>
<script th:src="@{/static/js/self/demo.js}"></script>
<script th:src="@{/static/js/log/log.js}"></script>
</html>

JavaScript

console.log(window.location.pathname);
let websocket = null;
if (window.location.pathname === "/log_websocket") {
console.log(1);
websocket = new WebSocket('ws://localhost:8080/log_websocket');
$(document).ready(function() {
// 指定websocket路径
websocket.onmessage = function(event) {
// 接收服务端的实时日志并添加到HTML页面中
$("#log-container div").append(event.data);
// 滚动条滚动到最低部
$("#log-container").scrollTop($("#log-container div").height() - $("#log-container").height());
};
});
}
window.onbeforeunload = function(){
if (websocket!=null) {
websocket.close();
}
}

/*
const message = $("#message");
const ws = new WebSocket("ws://localhost:8080/websocket");
window.onbeforeunload = function(){
ws.close();
}
ws.onopen = function(e) {
ws.send("客户端连接成功");
}
ws.onclose = function(e) {
console.log("Connection close...")
}
ws.onmessage = function(e) {
$("#result").text("收到消息:"+e.data)
}
$("#send").on("click",function() {
ws.send($(message).val());
})*/

效果

当有新的日志了，也会实时显示

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航