JSP 登入頁面：單一輸入框同時支援手機號與信箱登入

在設計登入介面時，常見需求是讓使用者在同一個帳號輸入框中，無論輸入手機號碼或電子信箱都能登入。後端 SQL 查詢只需以 OR 條件同時比對兩個欄位即可。

核心 SQL 寫法

SELECT * FROM users 
WHERE (phone = ? OR email = ?) 
AND password = ?;

參數綁定時，將使用者輸入的帳號字串同時綁定給前兩個佔位符，密碼綁定給第三個。

完整流程建議

1. 前端驗證：用正則簡單判斷輸入格式（手機號/信箱），給使用者即時提示，但不阻擋提交。
2. 後端統一查詢：使用上述 SQL，配合 PreparedStatement 防止 SQL 注入。
3. 密碼驗證：資料庫儲存應為雜湊值（如 BCrypt），查詢出用戶後在應用層比對密碼，避免明文密碼進入 SQL。
4. 索引優化：在 phone 和 email 欄位分別建立唯一索引，查詢效能極佳。

進階：單一欄位儲存帳號

若系統設計將手機與信箱統一存放在同一欄位 account，查詢更簡單：

SELECT * FROM users WHERE account = ? AND password = ?;

此時需在註冊階段保證手機與信箱不重複，並添加唯一索引。

安全提醒

• 嚴禁在前端或 URL 明文傳遞密碼，務必使用 HTTPS。
• 登入失敗次數限制、驗證碼、裝置指紋等風控措施建議加上。

掌握這類靈活的帳號查詢邏輯，能顯著提升使用者登入體驗。