你如何管理使用用户角色和权限角2

我工作的一个新的应用程序Angular2，我想知道你将如何管理路由到特定的角色访问和权限创建，编辑和删除某些项目角色。你如何管理使用用户角色和权限角2

我想知道你是怎么解决这个问题这样的：

你如何管理访问一些UI元素？应用程序如何知道节目或隐藏它？你使用单一服务吗？或者你为应用程序中的不同位置创建不同的条件？
你如何管理你的路由？你使用CanActivate，CanActivateChild，CanLoad等？您是否为所有路线建立单一保护服务或为不同的模块或组件提供不同的服务？
最后一个问题。最好的方式来划分应用程序，然后你可以像CMS一样出售它。我的意思是我们如何能够实现从市场上加载一些其他模块的可能性，并将其添加到您的应用程序中。

你是如何解决类似问题的？

任何指导，经验，或指向材料涵盖这些主题是非常感谢。提前致谢。

来源

2017-10-05 Roma Skydan

这个问题是远远这么的Q/A格式过于宽泛。有迹象表明，讨论如何解决这些问题的写的书全章。简而言之：路由，认证守卫和模块。 – axlj

@axlj是的，我明白了。你是对的。但是你怎么知道这么多人现在不喜欢看书。更多对某些问题有好点子的人不会写一本关于它的书。但是，也许如果所有这些人写一些小答案，那么我们将有一个地方，不喜欢读书的人可以阅读这个。并添加他们自己的东西:) –

我听到你，我更喜欢创造阅读长书。不幸的是，对这个特定问题的完整答案会产生这样的结果！ – axlj

正如在评论你的问题中提到，一个完整的答案超出了SO提问/回答的范围，所以你会发现你的问题在不久的将来这个原因关闭，但在这里是为你一些简单建议以进一步探索：

通过http/https登录/登录后/从服务器获取用户的权限。将这些权限存储在适合您的应用程序的地方，可能在服务中。如果您使用的是JWT，则可以在JWT令牌中返回权限。
为了简化问题，只处理客户端的权限。角色是服务器代码来确定用户拥有什么权限。无需通过将角色与客户端上的权限相混淆来解决问题。
与权威性警卫保护途径
保护个人的UI元素与* ngIf或ngSwitch/* ngSwitchCase
动态加载是一个很大的话题区 - 去了解它 - 大量的资源上网页。不过，据我所知，虽然你可以懒洋洋地加载模块，它们必须知道在编译时的应用。我可能是错的，但我不认为你可以加载要在运行任何东西。

来源

2017-10-08 18:25:57 GreyBeardedGeek

这个问题是相当广泛的，我不是你可以很容易地在这个答案中覆盖它。基本上有连接到它的三件事

路由
卫队
模块

你需要有单一护模块将检查整个应用程序和所有子路由将成为守卫路线的孩子。简而言之，它将充当整个应用程序的全球守卫。你的路由将被简要介绍。更多关于Guards

现在谈模块，你需要的一切分裂成常见和特色模块和重用模块或独立使用。这将帮助您像CMS一样销售它。更多关于Modules。

注意 - 这不是一个确切的答案，但一个要点，以您的问题

来源

2017-10-09 07:40:56

所以我不得不落实我制定了一个应用程序这样的事情，这是我如何处理它。

我创建了一个身份验证服务，这包含在该检查是用户有一个管理角色的方法：我创建了一个权威性后卫如下

auth.service.ts

public isManager(): boolean { 
    let isManager = false; 
    let user = this.getUserToken(); 
    //Stored my allowed groups in a config file, comma separated string 
    let allowedGroups = AuthenticationParams.filters.split(','); 
    let userGroups: any; 
    if (user !== null && user !== undefined) { 
     try { 
     let userGroups: any = user.role; 
     if (userGroups !== undefined && userGroups !== null && userGroups.length > 0) { 
      try { 
      userGroups.forEach((e: any) => { 
       if (allowedGroups.indexOf(e) > -1) { 
       isManager = true; 
       } 
      }); 
      } catch (e) { 
      if (allowedGroups.indexOf(userGroups) > -1) { 
       isManager = true; 
      } 
      } 
     } 
     } catch (e) { 
     isManager = false; 
     } 
    } 
    return isManager; 
} 

public getUserToken(): any { 
    return localStorage.getItem('jwtTokenName'); 
}

：

guard.component.ts

import { Injectable, OnInit } from '@angular/core'; 
import { CanActivate, CanActivateChild } from '@angular/router'; 
import { Router } from '@angular/router'; 
import { AuthenticationService } from '../services/helper/security/auth.service'; 

@Injectable() 
export class GuardComponent implements CanActivate { 

    constructor(private authenticationService: AuthenticationService, private _router: Router) { 
    } 

    canActivate() { 
    let isManager: boolean = this.authenticationService.isManager(); 
    if (!isManager) { 
     this._router.navigate(['unauthorized']); 
    } 
    return isManager; 
    } 
}

个

guard.module.ts

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { GuardComponent } from './guard.component'; 

@NgModule({ 
    declarations: [], 
    imports: [ CommonModule ], 
    exports: [], 
    providers: [ GuardComponent ], 
}) 
export class GuardModule { }

然后我用的是处理导航到管理部分

APP-routing.module.ts

{ path: 'management', component: AdminComponent, canActivate: [GuardComponent] }

我的路线警卫

在我的导航栏只需要调用isManager方法和存储的一个变量，并用它来确定wheth是否需要显示或不显示管理链接。

navbar.component.ts

public isManager: boolean = false; 

ngOnInit(): void { 
    this.isManager = this.authenticationService.isManager(); 
}

navbar.component.html

<li [routerLinkActive]="['active']" *ngIf="isManager"><a [routerLink]="['management']">Management Portal</a></li>

我不得不从每个方法删除一些数据，但是这会给你基本的想法。希望这有助于。

来源

2017-10-10 09:25:32

你如何管理使用用户角色和权限角2

回答

相关问题