기계 번역으로 제공되는 번역입니다. 제공된 번역과 원본 영어의 내용이 상충하는 경우에는 영어 버전이 우선합니다.

# 예제 5: Verified Permissions 및 Cedar를 사용한 UI 필터링
<a name="avp-ui-filtering-examples"></a>

Verified Permissions를 사용하여 승인된 작업을 기반으로 UI 요소의 RBAC 필터링을 구현할 수도 있습니다. 이는 다중 테넌트 SaaS 애플리케이션의 경우 특정 사용자 또는 테넌트와 연결될 수 있는 컨텍스트에 민감한 UI 요소가 있는 애플리케이션에 매우 유용합니다.

다음 예제에서는 `Users`의 `Role``viewer`가 업데이트를 수행할 수 없습니다. 이러한 사용자의 경우 UI는 업데이트 버튼을 렌더링해서는 안 됩니다.

![Amazon Verified Permissions 및 Cedar를 사용한 UI 필터링 예제](http://docs.aws.amazon.com/ko_kr/prescriptive-guidance/latest/saas-multitenant-api-access-authorization/images/avp-example-5.png)


이 예제에서는 단일 페이지 웹 애플리케이션에 4개의 버튼이 있습니다. 표시되는 버튼은 현재 애플리케이션에 로그인한 `Role` 사용자의에 따라 다릅니다. 단일 페이지 웹 애플리케이션은 UI를 렌더링할 때 Verified Permissions를 쿼리하여 사용자에게 수행할 권한이 있는 작업을 결정한 다음 권한 부여 결정에 따라 버튼을 생성합니다.

다음 정책은 값이 `Role` 인 유형이 사용자와 데이터를 모두 볼 `viewer` 수 있도록 지정합니다. 이 정책에 대한 `ALLOW` 권한 부여 결정에는 `viewData` 또는 `viewUsers` 작업이 필요하며 리소스가 `Data` 또는 유형과 연결되어야 합니다`Users`. `ALLOW` 결정을 통해 UI는 `viewDataButton` 및 라는 두 개의 버튼을 렌더링할 수 있습니다`viewUsersButton`.

```
permit (
    principal in GuiAPP::Role::"viewer",
    action in [GuiAPP::Action::"viewData", GuiAPP::Action::"viewUsers"],
    resource 
)
when {
   resource in [GuiAPP::Type::"Data", GuiAPP::Type::"Users"]
};
```

다음 정책은 값이 `Role` 인 유형이 데이터만 볼 `viewerDataOnly` 수 있도록 지정합니다. 이 정책에 대한 `ALLOW` 권한 부여 결정에는 `viewData` 작업이 필요하며 리소스가 유형과 연결되어야 합니다`Data`. `ALLOW` 결정을 통해 UI가 버튼을 렌더링할 수 있습니다`viewDataButton`.

```
permit (
    principal in GuiApp::Role::"viewerDataOnly",
    action in [GuiApp::Action::"viewData"],
    resource in [GuiApp::Type::"Data"] 
);
```

다음 정책은 값이 `Role`인 유형이 데이터 및 사용자를 편집하고 볼 `admin` 수 있도록 지정합니다. 이 정책에 대한 `ALLOW` 권한 부여를 결정하려면 `updateData`, `updateUsers` `viewData,` 또는의 작업이 필요하며 `viewUsers`리소스가 유형 `Data` 또는와 연결되어야 합니다`Users`. `ALLOW` 결정을 통해 UI는 `updateDataButton`, `updateUsersButton`, 및 버튼 4개를 모두 렌더링할 `viewDataButton`수 있습니다`viewUsersButton`.

```
permit (
    principal in GuiApp::Role::"admin",
    action in [
        GuiApp::Action::"updateData",
        GuiApp::Action::"updateUsers",
        GuiApp::Action::"viewData", 
        GuiApp::Action::"viewUsers"
       ],
    resource 
)
when {
   resource in [GuiApp::Type::"Data", GuiApp::Type::"Users"]
};
```