# 用戶認證功能規格文檔 (Web版)

## 📋 功能概述

**功能名稱**: 用戶認證系統 (Web端)  
**建立日期**: 2025-09-09  
**最後更新**: 2025-09-09  
**負責團隊**: 前端Web/設計/開發  
**對應Mobile規格**: `../mobile/05_用戶認證功能規格.md`

### 主要功能
- 多元化註冊登入，支援Email、第三方OAuth、SSO等方式
- 安全密碼管理，包含強度檢測、加密存儲、定期更新提醒
- 多帳戶整合，支援多個第三方帳戶綁定和統一管理
- 會話管理，靈活的登入狀態控制和安全登出
- 帳戶安全保護，二次認證、異常登入檢測、帳戶鎖定機制
- 個人資料管理，完整的用戶資訊編輯和隱私控制

### Web端特色功能
- **SSO企業登入**: 支援企業級單一登入(SAML/OIDC)
- **多設備管理**: 查看和管理所有登入設備
- **記住登入狀態**: 可選擇記住登入30天/永久
- **密碼管理器整合**: 與瀏覽器密碼管理器無縫整合
- **安全金鑰支援**: WebAuthn/FIDO2安全金鑰登入
- **帳戶資料匯出**: GDPR合規的個人資料匯出功能
- **進階隱私設定**: 詳細的隱私控制和資料共享設定

### 適用場景
- 企業和教育機構的統一帳戶管理
- 需要高安全性的商務用戶認證
- 多設備跨平台的帳戶同步需求
- 家庭用戶的多成員帳戶管理

### 與其他功能的關聯
- **學習系統**: 認證狀態決定學習內容和功能權限
- **道具商店**: 付費功能需要安全的帳戶認證
- **社交功能**: 帳戶綁定支援社交分享和好友系統
- **數據分析**: 用戶認證數據用於個性化學習推薦
- **客服系統**: 帳戶問題的客服支援和身份驗證

## 💻 涉及的Web頁面

### 主要頁面
1. **Page_Login_Main_W** - 登入主頁面 (Web版)
2. **Page_Register_Main_W** - 註冊主頁面 (Web版)
3. **Page_Password_Reset_W** - 密碼重設頁面 (Web版)
4. **Page_Profile_Main_W** - 個人資料頁面 (Web版)
5. **Page_Account_Settings_W** - 帳戶設定頁面 (Web版)
6. **Page_Security_Settings_W** - 安全設定頁面 (Web版)

### Web專用頁面
1. **Page_Device_Management_W** - 設備管理頁面 (Web專用)
2. **Page_Privacy_Settings_W** - 隱私設定頁面 (Web專用)
3. **Page_Data_Export_W** - 資料匯出頁面 (Web專用)
4. **Page_Account_Linking_W** - 帳戶綁定管理 (Web專用)
5. **Page_Enterprise_SSO_W** - 企業SSO設定 (Web專用)

### 輔助頁面
1. **Page_Email_Verification_W** - 電子郵件驗證頁面
2. **Page_Two_Factor_Setup_W** - 二次認證設定頁面
3. **Page_Account_Recovery_W** - 帳戶恢復頁面
4. **Modal_Security_Alert_W** - 安全警告模態視窗

## 🎯 詳細頁面規格

### Page_Login_Main_W - 登入主頁面 (Web版)

#### 功能說明
- **頁面目的**: 在桌面環境提供安全便捷的用戶登入體驗
- **進入條件**: 訪問需要認證的功能或直接輸入登入URL
- **退出條件**: 成功登入後跳轉到目標頁面或主頁

#### Web版佈局特點
- **居中登入卡片**: 響應式登入表單，支援多種螢幕尺寸
- **第三方登入區域**: 並列顯示多個第三方登入選項
- **安全提示區域**: 顯示安全建議和最近登入資訊
- **企業登入入口**: 企業用戶的SSO登入入口
- **背景視覺設計**: 品牌一致的背景圖片或動畫

#### 頁面欄位細節

| 欄位名稱 | 資料類型 | 必填 | 預設值 | 驗證規則 | 顯示條件 |
|---------|---------|------|--------|----------|----------|
| 登入帳號 | String | 是 | - | Email格式或用戶名 | 主要輸入框 |
| 登入密碼 | String | 是 | - | 6-128字符 | 密碼輸入框 |
| 記住登入 | Boolean | 否 | false | true/false | 記住登入選項 |
| 記住時長 | String | 否 | "30days" | 時長枚舉 | 記住登入子選項 |
| 驗證碼 | String | 否 | - | 驗證碼格式 | 安全策略觸發時 |
| 登入方式 | String | 是 | "email" | 登入方式枚舉 | 登入方式切換 |
| 企業網域 | String | 否 | - | 網域格式 | 企業登入模式 |
| 上次登入時間 | Date | 否 | - | 日期時間 | 歡迎回來提示 |
| 登入裝置資訊 | String | 否 | - | 裝置資訊 | 安全提示 |

#### Web版互動元素

| 元素名稱 | 元素類型 | 操作方式 | 快捷鍵 | 狀態變化 | 備註 |
|---------|---------|----------|--------|----------|------|
| 帳號輸入框 | 文本框 | 點擊/自動焦點 | Tab | 空白→輸入中 | 支援自動完成 |
| 密碼輸入框 | 密碼框 | 點擊/Tab | Tab | 隱藏→顯示 | 顯示/隱藏切換 |
| 登入按鈕 | 按鈕 | 點擊/Enter | Enter | 正常→登入中 | 主要操作按鈕 |
| 忘記密碼連結 | 連結 | 點擊/F鍵 | F | - | 跳轉密碼重設 |
| Google登入 | 按鈕 | 點擊/G鍵 | G | 正常→認證中 | 第三方OAuth |
| Apple登入 | 按鈕 | 點擊/A鍵 | A | 正常→認證中 | 第三方OAuth |
| 企業SSO | 按鈕 | 點擊/E鍵 | E | 正常→跳轉中 | 企業登入入口 |
| 密碼顯示切換 | 按鈕 | 點擊/Ctrl+H | Ctrl+H | 隱藏↔顯示 | 密碼可視性控制 |
| 驗證碼刷新 | 按鈕 | 點擊/R鍵 | R | - | 重新獲取驗證碼 |

#### Web版使用者操作流程
1. **基本登入**: 輸入帳號密碼 → 選擇記住登入 → 點擊登入 → 驗證成功進入系統
2. **第三方登入**: 選擇第三方平台 → 跳轉認證 → 授權確認 → 回到應用完成登入
3. **企業登入**: 選擇企業登入 → 輸入企業網域 → 跳轉SSO → 企業認證 → 自動登入
4. **安全驗證**: 觸發安全檢查 → 輸入驗證碼 → 通過二次認證 → 成功登入

### Page_Privacy_Settings_W - 隱私設定頁面 (Web專用)

#### 功能說明
- **頁面目的**: 提供完整的隱私控制設定，符合GDPR等隱私法規要求
- **進入條件**: 從帳戶設定進入或隱私政策連結進入
- **退出條件**: 保存隱私設定或取消修改

#### Web專有隱私功能
- **資料處理同意**: 詳細的資料處理用途說明和同意選項
- **Cookie控制**: 細粒度的Cookie類別控制
- **資料共享設定**: 控制資料與第三方的共享範圍
- **行為追蹤控制**: 學習行為和使用數據的追蹤設定
- **資料保留政策**: 個人資料的保留期限設定
- **匿名化選項**: 資料匿名化處理的選擇

#### 頁面欄位細節

| 欄位名稱 | 資料類型 | 必填 | 預設值 | 驗證規則 | 顯示條件 |
|---------|---------|------|--------|----------|----------|
| 資料收集同意 | Object | 是 | {} | 同意設定物件 | 分類同意區域 |
| Cookie偏好設定 | Object | 是 | {} | Cookie設定 | Cookie控制面板 |
| 行銷通訊同意 | Boolean | 是 | false | true/false | 通訊偏好設定 |
| 第三方資料共享 | Object | 是 | {} | 共享設定物件 | 資料共享控制 |
| 個人化設定 | Boolean | 是 | true | true/false | 個人化同意 |
| 分析資料收集 | Boolean | 是 | false | true/false | 分析同意設定 |
| 資料匯出格式 | String | 否 | "json" | 格式枚舉 | 資料匯出選項 |
| 帳戶刪除原因 | String | 否 | - | 1-500字 | 刪除帳戶時 |

### Page_Device_Management_W - 設備管理頁面 (Web專用)

#### 功能說明
- **頁面目的**: 管理所有已登入的設備，提供安全的設備控制功能
- **進入條件**: 從安全設定進入或安全警告時引導進入
- **退出條件**: 完成設備管理或返回安全設定

#### Web專有設備管理
- **活躍設備列表**: 顯示所有當前登入的設備
- **設備詳細資訊**: 設備類型、瀏覽器、IP位置、登入時間
- **遠程登出**: 可遠程登出指定設備或全部設備
- **可信設備**: 標記可信設備，減少安全驗證
- **登入通知**: 新設備登入的電子郵件通知設定

#### 頁面欄位細節

| 欄位名稱 | 資料類型 | 必填 | 預設值 | 驗證規則 | 顯示條件 |
|---------|---------|------|--------|----------|----------|
| 設備列表 | Array | 是 | [] | 設備陣列 | 主要列表區域 |
| 當前設備標識 | String | 是 | - | 設備ID | 當前設備標記 |
| 設備類型 | String | 是 | - | 設備類型枚舉 | 設備圖示 |
| 瀏覽器資訊 | String | 是 | - | 瀏覽器字串 | 技術資訊 |
| IP位置 | String | 是 | - | IP地址 | 地理位置 |
| 最後活躍時間 | Date | 是 | - | 日期時間 | 活動時間 |
| 可信狀態 | Boolean | 是 | false | true/false | 信任標記 |
| 登入通知設定 | Boolean | 是 | true | true/false | 通知偏好 |

## 🌐 Web端技術特點

### 企業級認證整合
- **SAML 2.0**: 支援SAML單一登入協議
- **OpenID Connect**: OIDC標準認證流程
- **LDAP整合**: 企業LDAP目錄服務整合
- **Active Directory**: 微軟AD域控制器整合

### 現代Web認證標準
- **WebAuthn**: 無密碼登入和硬體安全金鑰
- **FIDO2**: 強認證標準支援
- **PassKeys**: 蘋果/Google PassKeys整合
- **Biometric**: 瀏覽器生物識別API

### 安全性增強
- **CSP嚴格模式**: 內容安全政策防止XSS
- **SameSite Cookie**: 防止CSRF攻擊
- **HSTS**: 強制HTTPS傳輸安全
- **Rate Limiting**: API速率限制防止暴力破解

### 隱私合規支援
- **GDPR合規**: 歐盟一般資料保護規範
- **CCPA合規**: 加州消費者隱私法案
- **Cookie Law**: 歐盟Cookie指令合規
- **Data Portability**: 資料可攜權實現

## ⌨️ Web版快捷鍵系統

### 認證頁面快捷鍵
- `Tab` - 在表單欄位間切換
- `Enter` - 提交當前表單
- `Esc` - 取消當前操作
- `F` - 快速前往忘記密碼
- `G` - Google登入
- `A` - Apple登入
- `E` - 企業登入

### 設定頁面快捷鍵
- `Ctrl + S` - 保存設定
- `Ctrl + R` - 重置為預設值
- `Ctrl + E` - 匯出個人資料
- `Ctrl + D` - 下載資料副本
- `Delete` - 刪除選中項目

### 安全操作快捷鍵
- `Ctrl + L` - 登出當前設備
- `Ctrl + Shift + L` - 登出所有設備
- `Ctrl + T` - 切換可信設備狀態
- `F5` - 重新整理設備列表
- `Ctrl + N` - 開啟新的安全金鑰設定

## 📊 Web版業務邏輯差異

### 會話管理策略
- **長效會話**: 支援30天/永久記住登入
- **多標籤同步**: 跨瀏覽器標籤的登入狀態同步
- **自動續期**: 活躍使用時自動延長會話期限
- **閒置檢測**: 檢測用戶閒置並提示安全登出

### 密碼安全增強
- **密碼強度指示**: 即時密碼強度評估和建議
- **密碼歷史**: 防止重複使用近期密碼
- **自動生成**: 集成密碼生成器建議強密碼
- **洩漏檢測**: 檢測密碼是否出現在已知洩漏資料庫

### 隱私控制細化
- **分級同意**: 不同類別資料的分別同意機制
- **同意撤回**: 隨時撤回資料處理同意
- **影響說明**: 清楚說明撤回同意對功能的影響
- **資料最小化**: 僅收集必要的最少資料

## 🧪 Web版測試要點

### 認證流程測試
- [ ] 基本帳密登入流程正常
- [ ] 第三方OAuth登入正常
- [ ] 密碼重設流程完整
- [ ] 帳戶註冊驗證正常
- [ ] 二次認證設定和使用正常

### 安全功能測試
- [ ] 異常登入檢測和通知
- [ ] 帳戶鎖定機制正確觸發
- [ ] 設備管理功能完整
- [ ] 遠程登出功能正常
- [ ] 安全金鑰登入正常

### 隱私合規測試
- [ ] GDPR資料匯出功能正常
- [ ] Cookie同意機制正確
- [ ] 資料處理同意記錄完整
- [ ] 帳戶刪除流程合規
- [ ] 隱私政策同意機制正常

### 跨瀏覽器測試
- [ ] Chrome認證功能完整
- [ ] Firefox第三方登入正常  
- [ ] Safari WebAuthn支援正常
- [ ] Edge企業SSO功能正常

## 📝 Web端開發注意事項

### 安全實作要求
- 所有認證相關請求強制HTTPS
- 敏感資訊絕不在前端儲存
- 實施嚴格的CSP政策
- 使用安全的會話管理機制

### 隱私合規實作
- 實施同意管理平台(CMP)
- 提供完整的資料處理透明度
- 實現用戶權利行使機制
- 定期隱私影響評估

### 使用者體驗設計
- 簡化認證流程，減少摩擦
- 提供清楚的錯誤訊息和解決方案
- 支援無障礙設備和輔助技術
- 響應式設計適應各種螢幕尺寸

### 效能最佳化
- 認證頁面快速載入(<1秒)
- 第三方認證回調處理最佳化
- 設備列表分頁載入避免效能問題
- 使用適當的快取策略

---

**文檔狀態**: 🟢 已完成  
**最後更新**: 2025-09-09  
**版本**: v1.0  
**相關文檔**: 
- `../mobile/05_用戶認證功能規格.md` - 對應的Mobile版規格
- `../common/業務規則.md` - 共同業務邏輯
- `../common/數據模型.md` - 數據結構定義
- `../common/API規格.md` - API接口規格