0

我有两条开放路线（例如：/home、/details）。用户登录后，我想限制用户访问这些页面，直到他注销，通过直接更改 URL 或点击返回按钮。

我使用 AuthGuard 来限制用户在未登录时访问受保护的路线。

canActivate(
 next: ActivatedRouteSnapshot,
 state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | 
 boolean {
  if (localStorage.getItem('isLoggedIn') === null || 
    localStorage.getItem('isLoggedIn') === 'false') {
    return true;
  }

  this.router.navigate([state.url]);
  return false;
})
4

2 回答 2

0

您可以创建一系列主页和详细信息 url。例如，

const restrictedRoutes = ['about',  'details'];

并且在检查用户是否登录后，您可以在受限路由中添加一个检查当前路由是否存在的条件。基于此，您可以将用户重定向到其他页面。

if (restrictedRoutes.includes(route.url)) {
  // redirect path
}
this.router.navigate([state.url]);
  return false;
于 2019-07-30T16:29:59.563 回答
0

// 一般路由是 '/home', '/details'

在其他经过身份验证的路由（用户应该登录的地方）中使用 candeactivate authguard。在那里您可以检查条件并拒绝/重定向。

import { Injectable } from '@angular/core';
import { CanDeactivate } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { Router} from '@angular/router'; 

export interface CanComponentDeactivate {
  canDeactivate: () => Observable<boolean> | Promise<boolean> | boolean;
}

@Injectable()
export class CanDeactivateGuard implements CanDeactivate<CanComponentDeactivate> {
  openRoutes = ['/home', '/details'];
  intendedRoute: string = '';
  constructor(private _router: Router) {
    this.intendedRoute = _router.url;
  }
  canDeactivate(component: CanComponentDeactivate) {
    return this.openRoutes .includes(this.intendedRoute)? component.canDeactivate() : true;
  }

}

如果条件为真，您可以通过从相应组件中的 canDeactivate 方法返回 false 来取消导航。

于 2019-07-30T17:55:50.763 回答