Question

我有管理页面网址，但我想保护它，但是我不知道在这种情况下如何使用ngx权限，因为我是angular.com的新手，所以有人可以告诉我如何保护我的管理页面吗？有角的。这是我的重定向代码，写在下面：

if(this.userId === this.adminId){
              this.admin=true;
              this.router.navigate(['/admin']); }
            else{
            this.router.navigate(['/']);
            }

我正在使用AdminId，如果它与userId匹配，那么我会将路由器重定向到管理页面。我不知道这是重定向的唯一方法吗？所以请同时告诉我如何将路由器导航到管理页面安全地？任何建议将不胜感激。

Answer 1

您可以在路线中使用参数canActivate与警卫路由器配合使用，例如：

const routes: Routes = [      
{ path: 'admin', component: AdminComponent, canActivate: [AdminGuard] },
];

AdminGuard文件可以是：

重要：您只需要在页面网址中传递参数（userId和adminId）即可。

import { Injectable } from '@angular/core';
import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';

@Injectable()
export class CanActivateGuard implements CanActivate {

  constructor(
    public router: Router
  ) { }

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot,
  ) {
    const { userId, adminId } = route.queryParams;
    if (userId === adminId) {
      // this.router.navigate(['/admin']);
      return true; // This line allows user access to admin route
    }
    else {
      this.router.navigate(['/']);
      return false;
    }
  }
}

如何使用ngx权限以角度保护管理页面？

1 个答案: