Parameter an Route Guard übergeben

Ich arbeite an einer App mit vielen Rollen, die ich mithilfe von Wachen verwenden muss, um die Navigation für Teile der App basierend auf diesen Rollen zu blockieren. Mir ist klar, dass ich für jede Rolle individuelle Schutzklassen erstellen kann, aber lieber eine Klasse hätte, an die ich irgendwie einen Parameter übergeben könnte. Mit anderen Worten, ich möchte in der Lage sein, etwas Ähnliches zu tun:

{ 
  path: 'super-user-stuff', 
  component: SuperUserStuffComponent,
  canActivate: [RoleGuard.forRole('superUser')]
}

Aber da alles, was Sie passieren, der Typname Ihrer Wache ist, können Sie sich keinen Weg vorstellen, dies zu tun. Sollte ich einfach in die Kugel beißen und die einzelnen Schutzklassen pro Rolle schreiben und meine Illusion von Eleganz zerstören, stattdessen einen einzigen parametrisierten Typ zu haben?

Anstatt zu verwenden forRole(), können Sie Folgendes tun:

{ 
   path: 'super-user-stuff', 
   component: SuperUserStuffComponent,
   canActivate: RoleGuard,
   data: {roles: ['SuperAdmin', ...]}
}

und verwenden Sie dies in Ihrem RoleGuard

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot)
    : Observable<boolean> | Promise<boolean> | boolean  {

    let roles = route.data.roles as Array<string>;
    ...
}

Hier ist meine Meinung dazu und eine mögliche Lösung für das fehlende Anbieterproblem.

In meinem Fall haben wir einen Guard, der eine Berechtigung oder eine Liste von Berechtigungen als Parameter verwendet, aber es ist dasselbe, das eine Rolle spielt.

Wir haben eine Klasse für den Umgang mit Auth Guards mit oder ohne Erlaubnis:

@Injectable()
export class AuthGuardService implements CanActivate {

    checkUserLoggedIn() { ... }

Dies befasst sich mit der Überprüfung der aktiven Sitzung des Benutzers usw.

Es enthält auch eine Methode zum Abrufen eines benutzerdefinierten Berechtigungsschutzes, die tatsächlich von sich AuthGuardServiceselbst abhängt

static forPermissions(permissions: string | string[]) {
    @Injectable()
    class AuthGuardServiceWithPermissions {
      constructor(private authGuardService: AuthGuardService) { } // uses the parent class instance actually, but could in theory take any other deps

      canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
        // checks typical activation (auth) + custom permissions
        return this.authGuardService.canActivate(route, state) && this.checkPermissions();
      }

      checkPermissions() {
        const user = ... // get the current user
        // checks the given permissions with the current user 
        return user.hasPermissions(permissions);
      }
    }

    AuthGuardService.guards.push(AuthGuardServiceWithPermissions);
    return AuthGuardServiceWithPermissions;
  }

Auf diese Weise können wir die Methode verwenden, um einige benutzerdefinierte Schutzvorrichtungen basierend auf Berechtigungsparametern in unserem Routingmodul zu registrieren:

....
{ path: 'something', 
  component: SomeComponent, 
  canActivate: [ AuthGuardService.forPermissions('permission1', 'permission2') ] },

Der interessante Teil von forPermissionist AuthGuardService.guards.push- dies stellt im Grunde sicher, dass jedes Mal, wenn forPermissionseine benutzerdefinierte Schutzklasse aufgerufen wird, diese auch in diesem Array gespeichert wird. Dies gilt auch für die Hauptklasse:

public static guards = [ ]; 

Dann können wir dieses Array verwenden, um alle Wachen zu registrieren - dies ist in Ordnung, solange wir sicherstellen, dass zum Zeitpunkt der Registrierung dieser Anbieter durch das App-Modul die Routen definiert und alle Wächterklassen erstellt wurden (z. B. Importreihenfolge überprüfen und Halten Sie diese Anbieter in der Liste so niedrig wie möglich - ein Routing-Modul hilft):

providers: [
    // ...
    AuthGuardService,
    ...AuthGuardService.guards,
]

Hoffe das hilft.

Die Lösung von @ AluanHaddad gibt den Fehler "kein Anbieter" aus. Hier ist eine Lösung dafür (es fühlt sich schmutzig an, aber mir fehlen die Fähigkeiten, um eine bessere zu machen).

Konzeptionell registriere ich als Anbieter jede dynamisch generierte Klasse, die von erstellt wurde roleGuard.

Also für jede überprüfte Rolle:

canActivate: [roleGuard('foo')]

du solltest haben:

providers: [roleGuard('foo')]

Die aktuelle Lösung von @ AluanHaddad generiert jedoch für jeden Aufruf von eine neue Klasse roleGuard, auch wenn der rolesParameter derselbe ist. Die Verwendung lodash.memoizesieht folgendermaßen aus:

export var roleGuard = _.memoize(function forRole(...roles: string[]): Type<CanActivate> {
    return class AuthGuard implements CanActivate {
        canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot):
            Observable<boolean>
            | Promise<boolean>
            | boolean {
            console.log(`checking access for ${roles.join(', ')}.`);
            return true;
        }
    }
});

Beachten Sie, dass jede Rollenkombination eine neue Klasse generiert. Sie müssen daher jede Rollenkombination als Anbieter registrieren . Dh wenn Sie haben:

canActivate: [roleGuard('foo')]und canActivate: [roleGuard('foo', 'bar')]Sie müssen beide registrieren:providers[roleGuard('foo'), roleGuard('foo', 'bar')]

Eine bessere Lösung wäre, Anbieter automatisch in einer globalen Anbietersammlung zu registrieren roleGuard, aber wie gesagt, mir fehlen die Fähigkeiten, dies umzusetzen.