如何为 Angular Monorepo 中懒加载应用实现模块化用户访问控制

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree, Router } from '@angular/router';
import { Observable } from 'rxjs';
import { AuthService } from '@app/shared/services/auth.service'; // 假设存在一个共享的认证服务

@Injectable({
  providedIn: 'root' // 或者在 Project1Module 中提供
})
export class Project1Guard implements CanActivate {
  constructor(private authService: AuthService, private router: Router) {}

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

    // 这里是 Project1 特有的访问控制逻辑。
    // 这段逻辑属于 Project1 模块的职责范围。
    const hasAccess = this.authService.checkPermissionForModule('project1'); // 调用共享服务检查 Project1 权限

    if (hasAccess) {
      console.log('用户拥有 Project1 的访问权限。');
      return true; // 允许访问
    } else {
      console.warn('用户没有 Project1 的访问权限。重定向到未授权页面...');
      // 如果没有权限，可以重定向到登录页或未授权页面
      return this.router.createUrlTree(['/unauthorized']);
    }
  }
}

import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class AuthService {
  private isAuthenticatedSubject = new BehaviorSubject<boolean>(false);
  isAuthenticated$: Observable<boolean> = this.isAuthenticatedSubject.asObservable();

  // 假设的用户权限列表
  private userPermissions: string[] = ['dashboard', 'project1']; // 模拟用户拥有 'project1' 权限

  constructor() {
    // 模拟用户已登录
    this.isAuthenticatedSubject.next(true);
  }

  login(username: string, password: string): void {
    // 实际的登录逻辑，可能调用后端API
    console.log(`用户 ${username} 尝试登录...`);
    this.isAuthenticatedSubject.next(true);
    // 模拟获取用户权限
    this.userPermissions = ['dashboard', 'project1']; // 登录成功后更新权限
  }

  logout(): void {
    this.isAuthenticatedSubject.next(false);
    this.userPermissions = [];
  }

  /**
   * 检查当前用户是否对特定模块有访问权限。
   * 这里的逻辑可以根据实际的权限模型（如基于角色的访问控制 RBAC）进行扩展。
   * @param moduleName 要检查的模块名称。
   * @returns 如果用户有权限则返回 true，否则返回 false。
   */
  checkPermissionForModule(moduleName: string): boolean {
    if (!this.isAuthenticatedSubject.getValue()) {
      return false; // 未登录用户无权限
    }
    // 简单检查用户权限列表中是否包含该模块
    return this.userPermissions.includes(moduleName);
  }
}

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HomeComponent } from './home/home.component'; // 示例组件
import { UnauthorizedComponent } from './unauthorized/unauthorized.component'; // 示例未授权组件

// 从 project1 库中导入 Project1Guard
// 假设 'project1' 是一个 Angular library 的别名，或者使用相对路径
import { Project1Guard } from '@project1/project1'; // 或 '../../projects/project1/src/lib/project1.guard'

const routes: Routes = [
  { path: '', redirectTo: '/home', pathMatch: 'full' },
  { path: 'home', component: HomeComponent },
  {
    path: 'project1',
    loadChildren: () => import('@project1/project1').then(m => m.Project1Module), // 懒加载 Project1Module
    canActivate: [Project1Guard] // 在此处引用 Project1Guard
  },
  { path: 'unauthorized', component: UnauthorizedComponent }, // 未授权页面
  // ... 其他路由
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }