Angular 在url无效的情况下导航到基本url的Auth Guard

我正在尝试使用

authguard

，如果url无效，我希望导航到

/notfound

url。这是我的

authguard

：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot){
        const self = this;
        const userId= route.params.id;
        if(!userId){
            return false;
        }
        else{
            return from(this.authservice.httpUnauthorizedGet("/api/Users/isUserValid/" + userId)).pipe(
                map((data) => {
                    const dataUpdated: any = data;
                    if (dataUpdated.allowed === false) {
                        self.router.navigate(['/notfound']);
                        return false;
                    }
                    return dataUpdated.allowed;
                }),
                catchError(() => {
                    self.router.navigate(['/notfound']);
                    return of(false);
                }),
              );
        }
    }

这是可行的，但如果url无效（例如：

/users/1234

），它将首先导航到基本url（

http://localhost:4200

），然后导航到

http://localhost:4200/notfound

。 当我在

/notfound

上单击后退，而不是在导航到

/users/1234

时，我会被导航到baseurl

我认为这是因为

返回false

。这将导致导航到基本url，然后导航到路由器。导航导航到

/notfound

---

有没有办法，我可以直接导航到

/notfound

，而不是去基本url？

我让

app.routing.ts

处理它，而不是将404导航逻辑放入

AuthenticationGuard.ts

。请您检查以下代码，如果它适合您，请相应地应用它。关于你的信息，我正在使用的authService是ADAL，但这不应该是相关的

身份验证.guard.ts

canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): boolean {
      if (this.authService.isLogged) {
        return true;
      } else {
        this.router.navigate(['/login'], { queryParams: { returnUrl: state.url } });
        return false;
      }
  }

canActivateChild(childRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    return this.canActivate(childRoute, state);
}

const routes: Route[] = [
    { path: 'login', component: LoginComponent },
    { path: 'logout', component: LogoutComponent },
    { 
        path: '', component: MainComponent, canActivate: [ AuthenticationGuard ], 
        canActivateChild: [ AuthenticationGuard ], children: [
            { path: '', component: MyOwnComponent },
            { path: 'foo', component: FooComponent },
            { path: '**', component: NotFoundComponent }
        ]
    }
]

export const AppRoutes: ModuleWithProviders = RouterModule.forRoot(routes)

app.routing.ts

canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): boolean {
      if (this.authService.isLogged) {
        return true;
      } else {
        this.router.navigate(['/login'], { queryParams: { returnUrl: state.url } });
        return false;
      }
  }

canActivateChild(childRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    return this.canActivate(childRoute, state);
}

const routes: Route[] = [
    { path: 'login', component: LoginComponent },
    { path: 'logout', component: LogoutComponent },
    { 
        path: '', component: MainComponent, canActivate: [ AuthenticationGuard ], 
        canActivateChild: [ AuthenticationGuard ], children: [
            { path: '', component: MyOwnComponent },
            { path: 'foo', component: FooComponent },
            { path: '**', component: NotFoundComponent }
        ]
    }
]

export const AppRoutes: ModuleWithProviders = RouterModule.forRoot(routes)

下面这行是处理404的路线

{ path: '**', component: NotFoundComponent }