WebSocket实现实时查看服务器日志

桃扇骨 2022-12-30 12:58 542阅读 0赞

### pom ###

<dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-websocket</artifactId>
    </dependency>

### yml ###

server:
      port: 7500

### java代码 ###

@Configuration
    public class WebSocketConfig implements WebSocketMessageBrokerConfigurer { 
    
        /** * 扫描@ServerEndpoint,将@ServerEndpoint修饰的类注册为websocket * 如果使用外置tomcat，则不需要此配置 */
        @Bean
        public ServerEndpointExporter serverEndpointExporter()
        { 
            return new ServerEndpointExporter();
        }
    
    }

public class TailLogUtil { 
    
    	//要查看的日志文件路径
        private static String logFilePath = "/var/logs/mall.log";
    
        private static BufferedReader bufferedReader;
    
        public static void pushLog(Session session) { 
            try { 
                // 执行tail命令，获取输入流
                if (bufferedReader == null) { 
                    Process process = Runtime.getRuntime().exec("tail -f " + logFilePath);
                    InputStream inputStream = process.getInputStream();
                    bufferedReader = new BufferedReader(new InputStreamReader(inputStream));
                }
                // 通过WebSocket发送给实时日志给客户端
                String line;
                while ((line = bufferedReader.readLine()) != null) { 
                    session.getBasicRemote().sendText(line + "<br />");
                }
            } catch (IOException e) { 
                System.out.println(e.getMessage());
                e.printStackTrace();
            }
        }
    
    }

@ServerEndpoint("/wsServer")
    @Component
    public class WebSocketServer { 
    
        @OnOpen
        public void onOpen(Session session) { 
            TailLogUtil.pushLog(session);
        }
    
        @OnClose
        public void onClose(Session session) { 
    
        }
    
        @OnError
        public void onError(Throwable e) { 
            e.printStackTrace();
        }
    
    }

### index.html ###

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>查看日志</title>
    </head>
    <body>
    
    <div id="logContainer">
        <div></div>
    </div>
    
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script> $(document).ready(function () { if (typeof (WebSocket) == "undefined") { console.log("您使用的浏览器不支持WebSocket"); } else { //连接到websocket端点，测试服、正式服环境要写应用所在机器的具体域名|ip let socket = new WebSocket("ws://127.0.0.1:7500/wsServer"); socket.onopen = () => { console.log("已连接到wsServer"); }; socket.onclose = () => { console.log("已断开与wsServer的连接"); }; socket.onerror = (e) => { console.log("发生错误", e); } socket.onmessage = function (event) { console.log("接收到的数据：" + event.data); //添加到页面中 $("#logContainer div").append(event.data); //滚动条滚动到最低部 $("#logContainer").scrollTop($("#logContainer div").height() - $("#logContainer").height()); }; } }); </script>
    
    </body>
    </html>

部署后访问 ip:7500 即可查看实时日志