diff --git a/src/main/java/com/guwan/backend/constant/SecurityConstants.java b/src/main/java/com/guwan/backend/constant/SecurityConstants.java
index 718ff58..d28612b 100644
--- a/src/main/java/com/guwan/backend/constant/SecurityConstants.java
+++ b/src/main/java/com/guwan/backend/constant/SecurityConstants.java
@@ -24,6 +24,7 @@ public class SecurityConstants {
             "/daxz.html/**",
 
         "/polling-chat.html",
+        "/log-viewer.html",
 
         "/ws/chat/**",
 
diff --git a/src/main/resources/static/log-viewer.html b/src/main/resources/static/log-viewer.html
new file mode 100644
index 0000000..80b4b78
--- /dev/null
+++ b/src/main/resources/static/log-viewer.html
@@ -0,0 +1,254 @@
+<!DOCTYPE html>
+<html lang="zh">
+<head>
+    <meta charset="UTF-8">
+    <title>日志查看器</title>
+    <style>
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+            margin: 0;
+            padding: 20px;
+            background: #f5f5f5;
+        }
+        .log-container {
+            background: white;
+            border-radius: 8px;
+            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+            padding: 20px;
+            margin-bottom: 20px;
+        }
+        .log-header {
+            margin-bottom: 15px;
+            padding-bottom: 15px;
+            border-bottom: 1px solid #eee;
+        }
+        .log-title {
+            font-size: 20px;
+            color: #333;
+            margin: 0 0 10px 0;
+        }
+        .log-meta {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+            gap: 10px;
+            font-size: 14px;
+            color: #666;
+        }
+        .meta-item {
+            display: flex;
+            align-items: center;
+        }
+        .meta-label {
+            font-weight: 500;
+            margin-right: 8px;
+            color: #888;
+        }
+        .meta-value {
+            color: #444;
+        }
+        .log-body {
+            background: #f8f9fa;
+            padding: 15px;
+            border-radius: 4px;
+            font-family: 'Monaco', 'Consolas', monospace;
+            font-size: 14px;
+            line-height: 1.5;
+            overflow-x: auto;
+        }
+        .level {
+            display: inline-block;
+            padding: 2px 6px;
+            border-radius: 3px;
+            font-size: 12px;
+            font-weight: 500;
+        }
+        .level-DEBUG { background: #e3f2fd; color: #1976d2; }
+        .level-INFO { background: #e8f5e9; color: #2e7d32; }
+        .level-WARN { background: #fff3e0; color: #f57c00; }
+        .level-ERROR { background: #ffebee; color: #c62828; }
+        
+        .json-viewer {
+            background: #1e1e1e;
+            color: #d4d4d4;
+            padding: 15px;
+            border-radius: 4px;
+            overflow-x: auto;
+        }
+        .json-key { color: #9cdcfe; }
+        .json-string { color: #ce9178; }
+        .json-number { color: #b5cea8; }
+        .json-boolean { color: #569cd6; }
+        .json-null { color: #569cd6; }
+        
+        .controls {
+            margin-bottom: 20px;
+            display: flex;
+            gap: 10px;
+            align-items: center;
+        }
+        
+        .controls button, .controls select {
+            padding: 8px 16px;
+            border: 1px solid #ddd;
+            border-radius: 4px;
+            background: white;
+            cursor: pointer;
+        }
+        
+        .controls button:hover {
+            background: #f0f0f0;
+        }
+        
+        .pagination {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+        }
+        
+        #pageInfo {
+            min-width: 60px;
+            text-align: center;
+        }
+    </style>
+</head>
+<body>
+    <div class="controls">
+        <button onclick="loadLogs()">刷新日志</button>
+        <select id="pageSize" onchange="loadLogs()">
+            <option value="10">10条/页</option>
+            <option value="20" selected>20条/页</option>
+            <option value="50">50条/页</option>
+        </select>
+        <div class="pagination">
+            <button onclick="prevPage()">上一页</button>
+            <span id="pageInfo">第1页</span>
+            <button onclick="nextPage()">下一页</button>
+        </div>
+    </div>
+    
+    <div id="logsContainer"></div>
+
+    <template id="logTemplate">
+        <div class="log-container">
+            <div class="log-header">
+                <h1 class="log-title">日志详情</h1>
+                <div class="log-meta">
+                    <div class="meta-item">
+                        <span class="meta-label">时间戳:</span>
+                        <span class="meta-value timestamp"></span>
+                    </div>
+                    <div class="meta-item">
+                        <span class="meta-label">日志级别:</span>
+                        <span class="meta-value">
+                            <span class="level"></span>
+                        </span>
+                    </div>
+                    <div class="meta-item">
+                        <span class="meta-label">线程:</span>
+                        <span class="meta-value thread-name"></span>
+                    </div>
+                    <div class="meta-item">
+                        <span class="meta-label">Logger:</span>
+                        <span class="meta-value logger-name"></span>
+                    </div>
+                </div>
+            </div>
+            <div class="log-body">
+                <pre class="json-viewer"></pre>
+            </div>
+        </div>
+    </template>
+
+    <script>
+        let currentPage = 0;
+        
+        async function loadLogs() {
+            const pageSize = document.getElementById('pageSize').value;
+            const response = await fetch(`/api/common/logs?page=${currentPage}&size=${pageSize}`);
+            const logs = await response.json();
+            
+            const container = document.getElementById('logsContainer');
+            container.innerHTML = '';
+            
+            logs.forEach(log => {
+                const template = document.getElementById('logTemplate');
+                const logElement = template.content.cloneNode(true);
+                
+                // 填充基础信息
+                logElement.querySelector('.timestamp').textContent = log['@timestamp'];
+                logElement.querySelector('.level').textContent = log.level;
+                logElement.querySelector('.level').classList.add(`level-${log.level}`);
+                logElement.querySelector('.thread-name').textContent = log.thread_name;
+                logElement.querySelector('.logger-name').textContent = log.logger_name;
+                
+                // 填充JSON数据
+                logElement.querySelector('.json-viewer').innerHTML = formatJSON(log);
+                
+                container.appendChild(logElement);
+            });
+            
+            updatePageInfo();
+        }
+        
+        function prevPage() {
+            if (currentPage > 0) {
+                currentPage--;
+                loadLogs();
+            }
+        }
+        
+        function nextPage() {
+            currentPage++;
+            loadLogs();
+        }
+        
+        function updatePageInfo() {
+            document.getElementById('pageInfo').textContent = `第${currentPage + 1}页`;
+        }
+        
+        // 格式化JSON显示
+        function formatJSON(obj, indent = 0) {
+            const space = '    '.repeat(indent);
+            let html = '';
+            
+            if (typeof obj === 'object' && obj !== null) {
+                const isArray = Array.isArray(obj);
+                html += isArray ? '[\n' : '{\n';
+                
+                Object.entries(obj).forEach(([key, value], index, array) => {
+                    html += space + '    ';
+                    if (!isArray) {
+                        html += `<span class="json-key">"${key}"</span>: `;
+                    }
+                    
+                    if (typeof value === 'string') {
+                        html += `<span class="json-string">"${value}"</span>`;
+                    } else if (typeof value === 'number') {
+                        html += `<span class="json-number">${value}</span>`;
+                    } else if (typeof value === 'boolean') {
+                        html += `<span class="json-boolean">${value}</span>`;
+                    } else if (value === null) {
+                        html += `<span class="json-null">null</span>`;
+                    } else {
+                        html += formatJSON(value, indent + 1);
+                    }
+                    
+                    if (index < array.length - 1) {
+                        html += ',';
+                    }
+                    html += '\n';
+                });
+                
+                html += space + (isArray ? ']' : '}');
+            } else {
+                html += JSON.stringify(obj);
+            }
+            
+            return html;
+        }
+        
+        // 页面加载时自动加载日志
+        document.addEventListener('DOMContentLoaded', loadLogs);
+    </script>
+</body>
+</html> 
\ No newline at end of file
