2016-10-04 43 views
3

我想了解關於角應用程序的安全性方面的最佳實踐。可以說我有一個模型的細節屏幕視圖。我希望能夠做的,基於角色/給定用戶(從智威湯遜的權利要求得到,例如)的權限是:角2顯示/隱藏組件/基於角色的零件/索賠

  1. 啓用/禁用基於一個事實,某些輸入字段,如果用戶/沒有一定的作用的話,有效的一些角色可以編輯的記錄,有的不能

  2. 顯示/隱藏「保存」按鈕,再根據角色,再次以防止某些角色從編輯

我明白有canActivate,但如果感覺就像一個組件級別和我需要更細化的方法來根據角色改變組件內的東西。

什麼是最好的做法?

+2

只需使用'* ngIf = 「...」' –

回答

2

讓我們假設你有一個對象的地方保存配置文件。

{ 
    name: 'asdas', 
    role: 1 // for example, 1 for normal user, 2 for admin 
} 
  1. 啓用/禁用基於用戶是否是事實的某些輸入字段/是不是一定的作用的話,有效的一些角色可以編輯的記錄,有的不能

你可以根據自己的角色添加禁用

[disabled]="user.role === 1" 
  • 顯示/隱藏「保存」再次基於角色按鈕,再次以防止某些角色從編輯
  • 同樣爲這一個

    *ngIf="user.role === 2" 
    

    但是,你要編輯字段時翻一番後端檢查這些東西,如果用戶實際上是管理員F.E.

    +1

    感謝您的回答。是的,當然,服務器端檢查已到位。目前我只看到前端行爲。 –

    +1

    如果我有20個元件庫7個diferent角色和我有不同的scenarious爲每個角色(該元件庫,他們可以看到),寫ngIf的聲音,像和可怕的想法對我來說,任何提示如何處理 – Raimonds

    +0

    我需要實現同樣的事情。所以我認爲,我將創建一個後衛,可觀察到的服務,和/或確認指令,如果連接的用戶的訪問部件/元件所需的權限。所以我可以: –

    1

    使用Ng2Permission模塊directives用於顯示/隱藏或啓用/禁用元件。

    例如,假設你已經與PermissionService定義中AdminReporte一些許可,等等。現在下面的例子,delete button啓用時Admin權限定義或添加到許可店。請參閱此鏈接:PermissionService

    <button type="button" class="btn btn-danger btn-xs" 
        [hasPermission]="['Admin']" 
        onAuthorizedPermission="enable" 
        onUnauthorizedPermission="disable"> 
        <span class="glyphicon glyphicon-trash" aria-hidden="true"></span> 
        Delete 
    </button>