标签: angular2-guards

我想要实现的目标：我想使用 BehaviorSubject 在我的应用程序中共享身份验证状态。我使用身份验证状态，例如在 auth-guard 内部，以防止用户在用户已经通过身份验证时访问登录/注册页面。

问题：因为 BehaviorSubject 有一个初始值，它是 false（未登录），似乎 auth-guard 取了这个第一个值，而不是等待 uid-sync。

AuthInfo（身份验证状态存储）：

export class AuthInfo {

  constructor(public uid: string) {}

  isLoggedIn() {
    return !!this.uid;
  }
}

身份验证服务：

@Injectable()
export class AuthService {

  static UNKNOWN_USER = new AuthInfo(null);
  authInfo$: BehaviorSubject<AuthInfo> = new BehaviorSubject<AuthInfo>(AuthService.UNKNOWN_USER);

  constructor(private af: AngularFire) {
    this.af.auth.subscribe(auth => {
      if (auth) {
        console.log('got the uid');
        this.authInfo$.next(new AuthInfo(auth.uid));
      } else {
        this.authInfo$.next(AuthService.UNKNOWN_USER);
      }
    });
  }

  logIn(email: string, password: string): Promise<FirebaseAuthState> {
    return this.af.auth.login({email: email, …

我正在调查Guards并试图阻止CanDeactivate导航.我想用Save/Cancel显示一个简单的模态,save = navigate and well,cancel = cancel.

我有CanDeactivate工作,但似乎它没有在正确的时间解决

Guard.ts

canDeactivate(component: PortfolioModelComponent) {
    component.saveChanges(); // Opens modal
    return component.modalResponse.take(1); // isnt happening at the right time
}

Component.ts

 public modalResponse: Observable<boolean> = new Observable((observer) => { });

public saveChanges() {
    this.openSaveChangeModal();
}

// Modal save changes
public openSaveChangeModal() {
    $('#savePortfolioChangesModal').modal();
}

public closeSaveChangesModal() {
     this.modalResponse = new Observable((observer) => {
        observer.next(false);
    });
    $('#savePortfolioChangesModal').modal('hide');
}

public saveSaveChangesModal() {
    this.modalResponse = new Observable((observer) => {
        observer.next(true);
    });
    $('#savePortfolioChangesModal').modal('hide');
}

在第一次"保存"时,一旦显示模态,就不会发生任何事情.在第二个"保存",导航将在我回答模态之前发生.如何在合适的时间解决问题？

我试图实施授权保护https://angular.io/docs/ts/latest/guide/router.html#!#can-activate-child-guard

但我得到一个DI错误,我真的不知道为什么我注入UserService了我的模块.

我RouteGuard在全球模块中宣布,我UserService也是

  @NgModule({
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
  imports: [
   TranslateModule
  ],
  exports: [
    LoadingComponent,
         ],
  declarations: [
    LoadingComponent,

  ],
  entryComponents: [],
  providers: [UserService,RouteGuard]
})
export class GlobalModule { }

错误:

   Uncaught SyntaxError {__zone_symbol__error: Error: Can't resolve all parameters for RouteGuard: ([object Object], ?).
    at SyntaxError.ZoneAwa…, _nativeError: ZoneAwareError}

码

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

我的路由器中有以下几行：

..
    canActivate: [MyGuard], 
    path: "search",
    component: SearchComponent,
    data: {
        accessRoles: [roleAdmin, roleUser]
    }
..

我想通过MyGuard的canActivate限制对SearchComponent的访问。

是否可以从canActivate获取此数据数组？

先感谢您！

我在我的项目中使用了angular2和laravel 5.3.在laravel中,当用户登录服务器时将发送用户的权限以处理角度授权.所以我写了一个警卫来保护无法访问的用户的路由.这是我的警卫类代码:

export class AccessGuard implements CanActivate{

permissions;
currentRoute;
constructor(private authService:AuthService,private router:Router){
    this.permissions = this.authService.getPermissions();
}

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot){
    return this.checkHavePermission(state.url);
}

canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot){
    return this.checkHavePermission(state.url);
}

private checkHavePermission(url){
    switch (true) {
        case url.match(/^\/panel\/users[\/.*]?/):
            return this.getPermission('user.view');
        case url.match(/^\/panel\/dashboard/):
            return true;
        case url.match(/^\/panel\/permissions/):
            return this.getPermission('permissions.manager');
        case url.match(/^\/panel\/candidates[\/.*]?/):
            return this.getPermission('candidate.view');
    }
}


getPermission(perm){
    for(var i=0;i<this.permissions.length;i++){
        if(this.permissions[i].name == perm ){
            return true;
        }
    }
    return false;
}

}

既然路由是安全的,我想知道如何在组件类中访问用户权限.因为有时用户可以访问路线,但他看不到dom的特定部分.我该怎样处理这种情况？