技能 @delon/acl - Access Control List
🛡️

@delon/acl - Access Control List

安全

實現基於角色的訪問控制

Angular 應用程式需要可靠的方式來控制用戶權限並保護 UI 元素。本技能提供使用守衛、指令和權限檢查來實現 ACL 的程式碼模式。

支持: Claude Codex Code(CC)
⚠️ 64 差
1

下载技能 ZIP

2

在 Claude 中上传

前往 设置 → 功能 → 技能 → 上传技能

3

开启并开始使用

测试它

正在使用“@delon/acl - Access Control List”。 Show me how to protect a route for admin users only

预期结果:

  • Create a route guard using ACLService:
  • 1. Import CanActivateFn from @angular/router
  • 2. Inject ACLService and Router
  • 3. Check permissions with aclService.can({ role: ['admin'] })
  • 4. Return true or redirect to /403
  • 5. Add guard to route's canActivate array

安全审计

安全
v3 • 1/10/2026

This skill contains only documentation and TypeScript code examples. No executable code, scripts, network calls, or file system access beyond reading its own documentation file.

1
已扫描文件
470
分析行数
0
发现项
3
审计总数
未发现安全问题
审计者: claude 查看审计历史 →

质量评分

38
架构
100
可维护性
81
内容
21
社区
100
安全
52
规范符合性

你能构建什么

建立管理儀表板

為不同用戶層級建立具有基於角色的 UI 元素和受保護路由的管理介面。

實現權限系統

為多租戶 Angular 應用程式設計和實施細粒度權限結構。

將 UI 連接至後端權限

將前端 ACL 與後端安全規則橋接，以實現全面的訪問控制。

试试这些提示

基本 ACL 設定 
Show me how to set up @delon/acl with ACLService to check user permissions in an Angular component.
路由保護 
Create a CanActivateFn route guard using ACLService to protect admin routes in Angular.
條件式 UI 
Show how to use *aclIf directive to conditionally show buttons based on user permissions.
藍圖權限 
Implement a PermissionService that integrates @delon/acl with ng-events blueprint permissions for construction site tracking.

最佳实践

  • 在認證完成後使用 APP_INITIALIZER 儘早初始化 ACL
  • 使用計算訊號與 ACL 進行反應式權限檢查
  • 結合用戶端 ACL 與伺服器端安全規則以實現深度防禦

避免

  • 在元件中直接硬編碼角色檢查而非使用 ACLService
  • 僅依賴用戶端 UI 隱藏而沒有伺服器端驗證
  • 在登出或用戶切換時未重置 ACL 狀態

常见问题

支援哪些 Angular 版本？
@delon/acl 支援 Angular 17+ 獨立元件和 Angular 20+ 的 @if 控制流。
@delon/acl 支援哪些權限格式？
它支援基於角色（admin、user）和基於能力（task:create、blueprint:edit）的權限，採用 oneOf/allOf 模式。
@delon/acl 如何與認證整合？
使用 @delon/auth 進行認證，然後在 APP_INITIALIZER 中使用用戶角色初始化 ACLService。
用戶端 ACL 是否足夠���全？
不行。用戶端 ACL 只會隱藏 UI 元素。資料存取必須始終實施伺服器端驗證。
我可以在 Angular 訊號中使用 ACL 嗎？
可以。建立計算訊號，例如：canEdit = computed(() => aclService.can('task:edit'))。
這與其他 Angular 權限庫有何不同？
@delon/acl 是 ng-alain 生態系統的一部分，具有內建指令、守衛和深度 Angular 整合。

开发者详情

作者

7Spade

许可证

MIT

仓库

https://github.com/7Spade/ng-dragon/tree/main/.github/skills/delon-acl

引用

main

文件结构

📄 SKILL.md