JSP/JS 頁面關閉刷新保存數據：必須後端持久化，前端不可靠

誤區

試圖用 window.onbeforeunload、localStorage 在關閉/刷新時保存，但：

• 瀏覽器可能不執行回調（崩潰、強制關閉）
• localStorage 同源策略限制，不可跨設備
• 無法應對並發衝突

正確架構：MVC + AJAX 持久化

// 前端：每次增刪改立即發送 AJAX
function saveRow(data) {
    fetch('/api/rows', {method:'POST', body:JSON.stringify(data)})
        .then(r=>r.json()).then(res=>console.log('saved', res.id));
}

// 後端：Servlet/JPA 接收入庫
@WebServlet("/api/rows")
public class RowServlet extends HttpServlet {
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) {
        Row row = gson.fromJson(req.getReader(), Row.class);
        rowDao.save(row); // 持久化到數據庫
        resp.getWriter().write(gson.toJson(row));
    }
}

刷新恢復

頁面加載時 GET /api/rows 從數據庫讀取最新數據渲染表格。