代码提交

src/main/resources/logback-spring.xml

@@ -6,7 +6,7 @@
     <!-- 日志输出到控制台 -->
     <appender name="CONSOLE" class="ch.qos.logback.core.ConsoleAppender">
         <filter class="cn.somkit.fmt.filter.LogStashFilter">
-            <level>INFO</level>
+            <level>DEBUG</level>
         </filter>
         <encoder>
             <pattern>${CONSOLE_LOG_PATTERN}</pattern>
@@ -15,7 +15,7 @@
     </appender>
 
     <!-- 指定日志输出级别，以及启动的Appender -->
-    <root level="INFO">
+    <root level="DEBUG">
         <appender-ref ref="CONSOLE"/>
     </root>
 </configuration>

src/main/resources/templates/logging.html

@@ -19,9 +19,12 @@
     <script th:src="@{/common/js/LogMonitorAdaptive.js}" type="text/javascript" charset="utf-8"></script>
     <script type="text/javascript" th:inline="javascript" charset="utf-8">
         window.onload = () => {
+
+            let ws = null;
+
             const logger = new LogMonitorAdaptive('#logContainer', {
                 theme: 'dark',
-                maxLines: 5000,
+                maxLines: 10000,
                 fontSize: 14,
                 enableFilter: true,
                 enableSearch: true,
@@ -34,19 +37,44 @@
                 enableWordWrap: true,
                 showTimestamp: true, // 是否显示时间戳
                 showLevel: true,     // 是否显示日志级别标签
+                wordWrap: true,    // 日志内容是否自动换行（true=换行，false=横向滚动）
                 //暂停/继续 回调函数
-                onTogglePause: (isPaused) => {
+                onTogglePause: async (isPaused) => {
                     const options = {
                         url: Fmt.ctx() + '/logging/close',
                         data: {closed: isPaused},
                         method: 'post'
                     };
-                    Fmt.axios(options).then((result) => console.log(result)).catch((err) => console.error(err));
+                    await Fmt.axios(options).then((result) => console.log(result)).catch((err) => console.error(err));
+                    ws.send('发送日志');
                 },
                 onCreated: () => {
                     console.log('日志容器已创建');
                 }
             });
+
+            try {
+                if ('WebSocket' in window) {
+                    ws = new WebSocket((Fmt.ctx() + '/socket/ws').replace("http", "ws").replace("https", "wss"));
+                } else {
+                    alert('浏览器不支持WebSocket通讯');
+                    return false;
+                }
+
+                ws.onmessage = function (event) {
+                    if(event.data){
+                        let data = JSON.parse(event.data);
+                        logger.log(data.loggerName + ' : ' + data.message, data.level, data.timestamp);
+                    }
+                }
+
+                //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
+                window.onbeforeunload = ()=> {
+                    ws.close();
+                };
+            } catch (e) {
+                alert('WebSocket:链接失败');
+            }
         }
     </script>
 </body>