Discussion :

[Daïmanu]

Bonjour.

Je travaille sur une application web singlepage (Angular 4 + API REST) avec un système de rôles et de permissions. Par exemple le rôle administrateur peut bannir des utilisateurs, un utilisateur simple ne le peut pas.

Actuellement ce système est implémenté à deux endroits : côté front (dans les routes Angular) et côté serveur (dans l'API REST).

Je voudrais centraliser ce système en un endroit, peut-être une base de données.

Est-ce que vous connaissez des technos pour le faire, une lib Angular4 ou autre ? Ou est-ce que je dois le faire manuellement ?

[Daïmanu]

Je fournis quelques détails supplémentaire.

Mon routeur actuel contient plusieurs lignes comme celle-ci :

Code typescript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
{ path: 'users/:userid/password/update', component: PasswordresetComponent, canActivate: [Role], data: {roles: ['USER','ADMIN']}},
{ path: 'users', component: PasswordresetComponent, canActivate: [Role], data: {roles: ['ADMIN']}},

L'idée serait de supprimer les informations de roles, et donc la partie data, du routeur, et récupérer les permissions de rôles dynamiquement depuis une base de données.

J'ai trouvé quelques exemples sur Angular 2, mais rien sur Angular 4.

[Marco46]

J'ai trouvé quelques exemples sur Angular 2, mais rien sur Angular 4.

Angular 2 et Angular 4 c'est exactement le même framework, c'est Angular. Sauf à ce que ce que tu ais trouvé soit cassé par un breaking change de la 2 vers la 4 il n'y a aucune raison pour que cela ne fonctionne pas.

[pterrat]

A ma connaissance tu dois le faire manuellement, pourquoi veux-tu tout centraliser?

[Daïmanu]

@Marco46
Exact, j'ai encore du mal avec les différentes versions d'Angular.

@pterrat
Pour deux raisons : si je rajoute une route dans l'application je dois modifier trois éléments, le routeur, la navbar et le serveur de webservices. Donc l'information est dupliquée à plusieurs endroits, ce qui n'est pas bon.
Aussi si je pars sur une application mobile, et que je me débrouille pour garder la même nomenclature pour les routes et les vues dans l'application, je voudrais éviter de dupliquer l'information une fois de plus.

Donc l'idée serait de garder le routeur et la navbar aussi simple que possible, dans l'idéal juste déclarer les routes, et faire un appel au webservice avant un changement de page pour savoir si une route est ouverte ou restreinte à un instant t.

[Daïmanu]

Salut.

J'ai réfléchi à la question, et je pense partir sur un service qui va récupérer des infos sur le serveur et initialiser le routeur avant toutes les autres initialisations.

Il faut juste que je trouve comment créer un objet de type routeur et comment lancer du code au chargement de l'appli.

[Daïmanu]

Je me heurte à un soucis.

Le routeur est défini dans app-routing.module.ts, qui ne contient pas de classe. Du coup je ne peux pas injecter de dépendances dans le constructeur, or j'ai besoin d'accéder à un service.
J'ai vu qu'on peut passer par las classe ReflectiveInjector, mais ça m'a l'air compliqué.

J'essaye de l'utiliser comme ceci :

Code typescript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
let providers = ReflectiveInjector.resolve([PermissionsService, Http]);
let injector  = ReflectiveInjector.fromResolvedProviders(providers);

Mais j'ai une erreur au démarrage de l'application Error: No provider for ConnectionBackend! (PermissionsService -> Http -> ConnectionBackend).