Update: build artifacts and classes

2026-03-18 15:18:30 +08:00
parent efcfe7e012
commit e8afe9a5f4
33 changed files with 394 additions and 27 deletions
--- a/target/classes/static/aop.html
+++ b/target/classes/static/aop.html
@@ -28,6 +28,8 @@
        .nav { margin-bottom: 20px; }
        .nav a { margin-right: 15px; color: #6DB33F; text-decoration: none; }
        .nav a:hover { text-decoration: underline; }
+        .lab { background:#fff7e6; border-left:4px solid #fa8c16; padding:15px; border-radius:8px; margin:15px 0; }
+        .lab h4 { color:#ad6800; margin-bottom:8px; }
    </style>
 </head>
 <body>
@@ -38,11 +40,24 @@
    </div>
    
    <h1>🔪 AOP 切面编程</h1>
+
+    <div class="lab">
+        <h4>🧪 实验任务卡（AOP）</h4>
+        <label style="display:block;margin-bottom:8px;"><input id="aopTaskDone" type="checkbox" onchange="toggleAopTaskDone(this)"> 本任务我已经完成</label>
+        <ul style="padding-left:20px;line-height:1.8;">
+            <li>目标：观察同一请求如何触发 Before/After/Around 通知</li>
+            <li>步骤1：调用用户接口 <code>/api/users</code></li>
+            <li>步骤2：回到本页点击“刷新统计数据”</li>
+            <li>预期：统计里能看到 Controller/Service 方法耗时累积</li>
+            <li>常见坑：只看页面不看控制台，容易错过切面日志</li>
+        </ul>
+    </div>
    
    <div class="card">
        <h3>📊 实时性能统计</h3>
        <p>AOP 自动统计所有 Controller 和 Service 方法的执行时间</p>
        <button class="btn btn-primary" onclick="loadStats()">刷新统计数据</button>
+        <button class="btn btn-info" onclick="demoValidationError()">演示校验失败</button>
        <div class="result-box" id="statsResult">点击按钮查看...</div>
    </div>
    
@@ -167,11 +182,41 @@ execution(* com.example.demo.service.*.save*(..))
    <p style="margin-top: 30px;"><a href="/">← 返回学习中心</a></p>
    
    <script>
+        const AOP_TASK_KEY = 'task.aop.done';
+
+        function toggleAopTaskDone(el) {
+            localStorage.setItem(AOP_TASK_KEY, el.checked ? '1' : '0');
+        }
+
+        function initAopTaskState() {
+            const done = localStorage.getItem(AOP_TASK_KEY) === '1';
+            const checkbox = document.getElementById('aopTaskDone');
+            if (checkbox) checkbox.checked = done;
+        }
+
+        async function demoValidationError() {
+            const box = document.getElementById('statsResult');
+            box.textContent = '发送错误示例请求中...';
+            try {
+                const res = await fetch('/api/users', {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ name: '', email: 'bad', age: 999 })
+                });
+                const data = await res.json();
+                box.textContent = JSON.stringify(data, null, 2);
+            } catch (e) {
+                box.textContent = '错误: ' + e.message;
+            }
+        }
+
        async function loadStats() {
            const res = await fetch('/aop/stats');
            const data = await res.json();
            document.getElementById('statsResult').textContent = JSON.stringify(data, null, 2);
        }
+
+        initAopTaskState();
    </script>
 </body>
 </html>