技能 @delon/auth Authentication & Authorization
🔐
@delon/auth Authentication & Authorization
安全
為 Angular 應用程式添加安全身份驗證
在 Angular 中建構安全身份驗證需要謹慎實作令牌、守衛和權限檢查。此技能提供立即可用的模式，用於 JWT 管理、基於角色的存取控制和使用 @delon/auth 庫的路線保護。
支持: Claude Codex Code(CC)
1
下载技能 ZIP
2
在 Claude 中上传
前往 设置 → 功能 → 技能 → 上传技能
3
开启并开始使用
测试它
正在使用“@delon/auth Authentication & Authorization”。 Add authentication to my Angular app with Firebase Auth
预期结果:
- ✓ 配置 @delon/auth 的 token_send_template 和 login_url
- ✓ 創建包含 login() 和 logout() 方法的 AuthService
- ✓ 設定 authGuard 以保護路線免受未經身份驗證的存取
- ✓ 配置 HTTP 請求中的自動令牌注入
- ✓ "實作令牌在過期前刷新（6000ms 偏移）
- ✓ 使用 DA_SERVICE_TOKEN 安全地儲存 JWT
安全审计
安全v3 • 1/10/2026
This is a documentation-only skill containing guidance on Angular authentication implementation. No executable code, scripts, network calls, or filesystem access are present. All content consists of legitimate TypeScript patterns for authentication and authorization.
1
已扫描文件
585
分析行数
0
发现项
3
审计总数
未发现安全问题
审计者: claude 查看审计历史 →
质量评分
38
架构
100
可维护性
83
内容
20
社区
100
安全
61
规范符合性
你能构建什么
為 Angular 應用程式添加登入功能
使用 JWT 令牌、自動會話管理和受保護的路線實作安全的用戶登入。
建構基於角色的存取
使用路線守衛和組件層級的存取檢查創建管理員、用戶和自定義角色權限。
保護 API 通訊
配置 HTTP 請求中的自動令牌注入，在令牌過期前刷新並安全儲存。
试试这些提示
基本登入設定
使用 @delon/auth 為我的 Angular 應用程式添加身份驗證。包括使用電子郵件和密碼的登入組件、JWT 令牌儲存，以及在 HTTP 標頭中自動注入令牌。
路線保護
使用 @delon/auth 創建身份驗證守衛，將未經身份驗證的用戶重新導向到登入頁面。保護儀表板和管理路線。
角色權限
使用 @delon/auth 實作基於角色的存取控制。為管理員、經理和用戶角色創建守衛。展示如何在組件中檢查權限。
令牌刷新
配置 @delon/auth 的自動令牌刷新。透過登出用戶並清除會話來處理過期的令牌。與 Firebase Auth 令牌刷新整合。
最佳实践
- 在正式環境中始終使用 HTTPS 以保護令牌傳輸
- 設定短暫的令牌過期時間，並為長期會話使用刷新令牌
- 為身份驗證失敗和網路錯誤實施適當的錯誤處理
- 在登出時清除所有身份驗證狀態，包括令牌和用戶資料
避免
- 在 localStorage 中儲存令牌而不加密 - 改用 DA_SERVICE_TOKEN
- 跳過後端的角色驗證 - 始終在伺服器端驗證權限
- 在客戶端程式碼中硬編碼 API URL 或敏感配置
- 允許未經身份驗證的存取受保護路線而沒有適當的守衛
常见问题
支援哪些 Angular 版本？
@delon/auth 支援 Angular 17+，包含獨立組件和新的控制流程語法。
JWT 令牌應該持續多久？
建議使用短效訪問令牌（15-30 分鐘）搭配刷新令牌。將 refreshOffset 設定為 6000ms。
可以與其他身份驗證提供者整合嗎？
可以。此技能展示了 Firebase Auth 整合，但 @delon/auth 可以與任何 OAuth2 或基於 JWT 的提供者配合使用。
用戶資料是否安全儲存？
令牌透過 DA_SERVICE_TOKEN 安全儲存。避免在客戶端儲存中儲存敏感的用戶資料。
如何除錯身份驗證問題？
啟用身份驗證事件的除錯記錄。檢查瀏覽器 DevTools 中請求裡的令牌和控制台錯誤。
這與單獨使用 Auth0 或 Firebase Auth 相比如何？
@delon/auth 在任何身份驗證提供者的基礎上添加了 Angular 特定功能，如路線守衛、HTTP 攔截器和 ACL 整合。