Java 考試系統計時器設計：前端倒數計時搭配後端雙重驗證的最佳實踐

需求分析

開發線上考試系統，需在考生瀏覽器顯示倒數計時，時間到自動提交試卷。初學者易誤以為需在後端執行緒計時，實際上前端 JavaScript 即可精確處理 UI 倒數，後端僅需驗證提交時間合法性。

架構建議

前端（JavaScript）

• 使用 setInterval 每秒更新顯示。
• 倒數結束自動觸發 form.submit() 或 AJAX 提交答案。
• 將考試截止時間（Unix timestamp）由後端下發，避免客戶端時間偏差。

後端（Java Servlet/Controller）

• 接收提交時比對當前伺服器時間與截止時間。
• 若超時，拒絕評分並記錄違規。
• 可選：提供 WebSocket 或長輪詢推送「剩餘時間」同步多標籤頁。

核心代碼片段

// 前端倒數邏輯
const deadline = Date.parse(examEndTime); // 後端傳入的 ISO 字串
const timer = setInterval(() => {
    const now = Date.now();
    const diff = deadline - now;
    if (diff <= 0) {
        clearInterval(timer);
        document.getElementById('examForm').submit();
        return;
    }
    const minutes = Math.floor((diff % (1000*60*60)) / (1000*60));
    const seconds = Math.floor((diff % (1000*60)) / 1000);
    document.getElementById('timer').textContent = `${minutes}:${seconds.toString().padStart(2,'0')}`;
}, 1000);

安全性補充

純前端計時可被竄改，務必在後端以伺服器時間為準驗證提交時間戳，確保公平性。