Jak zaimplementować autoryzację ACL/roli przy pomocy kątowej 2?

Question

Jaki jest najlepszy sposób implementacji ACL/papieru na podstawie kątowej 2?

Mój scenariusz, w dużym skrócie, jest następujący: role są dynamiczne i opierają się na uprawnieniach, które klient może skonfigurować, a które również mogą być dynamiczne.

Muszę uniemożliwić użytkownikowi dostęp do konkretnego zasobu, do którego nie jest uprawniony. Do tego myślałem o użyciu koncepcji Strażników Kątowych. Dzięki funkcji CanActivate Guard mogę ustawić, czy pozwolić użytkownikowi przejść, czy nie, na podstawie informacji, które umieszczę na każdej trasie. Ta informacja będzie nazwą zasobu, do którego odnosi się ta trasa. Kiedy dotarłem do strażnika, mogłem porównać jego rolę i sprawdzić, czy jego rola ma dostęp do tej funkcji i czy zezwolić na nawigację.

Ale biorąc to pod mógł wpaść jeszcze dwa problemy:

1 - Jak przekierować użytkownika do zasobu, który ma dostęp do? Czy muszę wyświetlić listę plików trasy i poszukać kogoś, kto jest zgodny z jego rolą, a następnie przekierować tam?

2 - Jak wyłączyć składniki, których nie widać na stronach, do których ma dostęp? Na przykład ma dostęp do strony aukcji X, ale nie ma dostępu do tworzenia nowego elementu, więc muszę usunąć przycisk Utwórz coś. A raczej, jak to zrobić z elementami div, które zawierają określone informacje dla niektórych ról, ale nie dla ich roli?

Chciałbym wiedzieć, jak najlepiej podejść do tego scenariusza w kanciastym ekosystemie.

Dzięki za słuchanie.

Answer 1

Możesz użyć do tego biblioteki ngx-permissions. Obsługuje, a następnie składnia, leniwe ładowanie, izolowane leniwe ładowanie. Dodaj bibliotekę do projektu:

@NgModule({ 

imports: [ 
    NgxPermissionsModule.forRoot() 
] 
}) 
export class AppModule { } 

Role Załaduj

NgxRolesService 
.addRole('ROLE_NAME', ['permissionNameA', 'permissionNameB']) 

NgxRolesService.addRole('Guest',() => { 
    return this.sessionService.checkSession().toPromise(); 
}); 

NgxRolesService.addRole('Guest',() => { 
    return true; 
}); 

wykorzystania w szablonach

<div *ngxPermissionsOnly="['ADMIN', 'GUEST']"> 
    <div>You can see this text congrats</div> 
</div> 

chronić baczności

const appRoutes: Routes = [ 
{ path: 'home', 
component: HomeComponent, 
canActivate: [NgxPermissionsGuard], 
data: { 
    permissions: { 
    only: ['ADMIN', 'MODERATOR'], 
    except: ['GUEST'] 
    } 
    } 
}, 
]; 

o szczegóły dokumentacji kasy wiki page.

Answer 2

Sprawdź CASL istnieją artykuły o integracji w Vue i Aurelia ale dla kątowa 2+ realizacja powinna być bardzo podobna

Główną ideą, że można określić zdolności na użytkownika

import { AbilityBuilder } from 'casl' 


// allow to read and create Todo-s for everybody and update for assignees 
export default AbilityBuilder.define(can => { 
    can(['read','create'], 'Todo') 
    can(['update'], 'Todo', { assignee: user.id }) 
}) 

Istnieje również artykuł w dokumentacji o tym, jak map abilities to different roles