Angular 5身份验证

我试图了解与Angular和.Net核心的身份验证过程，它向我发送了一个jwt持票人令牌（Works）。所以我的问题是，我不知道我应该怎么做在守卫和身份验证服务来正确地管理用户（以后有角色）。但我尝试了一些东西，现在我不知道我应该在我的AuthService中做什么。Angular 5身份验证

编辑登录后，我会从服务器得到一个令牌和到期日期。所以我想存储这些，后来还声称，但idk如何。和我应该回来的。

这是我AuthService看起来像：

@Injectable() 
export class AuthService { 

isLoggedIn = false; 

    constructor(private http: HttpClient) {} 

login(email:string, password:string) :Observable<boolean>{ 
    this.http.post('/login', {email, password}) 
    .subscribe(data => 
    { 
     //TODO: check for Token ??? 
     let userAuth = data; 
     if(userAuth) { 
      localStorage.setItem('currentUser', JSON.stringify(userAuth)); 
      return true; 
     }else{ 
      return false; 
     } 
    }, 
    (err: HttpErrorResponse) => { 
     if(err.error instanceof Error){ 
     console.log("error client side"); 
     }else{ 
     console.log("Server side error."); 
     } 
    }); 
    //what should i return ????? and how 
    } 

logout() { 
    localStorage.removeItem('currentUser'); 
} 
}

现在我不知道如何检查，如果令牌是存在的，如果其显着如何返回boolean变量。之后登录完成后，检查未来调查也很重要？

和M AuthGuard看起来是这样的：

@Injectable() 
export class AuthGuardService implements CanActivate{ 

constructor(private router:Router) { } 

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

if(localStorage.getItem('currentUser')){ 
    return true; 
} 

this.router.navigate(['auth/login'], 
    {queryParams: { returnUrl: state.url}}); 

} 

}

来源

2017-12-18 Amsel

什么问题>？ –

发布代码，而不是它的图像。 –

我假设你也想存储令牌。或者'currentUser'的内容是什么？是的，如上所述，这有什么问题？ :) – Alex

只是我的意见和想法。

就我个人而言，我会在我的登录方法中执行此操作。这实际上会返回一个Observable。注意：您需要在您的登录组件中进行订阅。

login(email:string, password:string) :Observable<boolean>{ 
    return this.http.post('/login', {email, password}) 
    .map(data => { 
     let userAuth = data; 
     if(userAuth) { 
     localStorage.setItem('currentUser', JSON.stringify(userAuth)); 
     return true; 
     }else{ 
     return false; 
     } 
    } 
}

现在关于你的警惕。你检查确实很周。你可以提出请求来检查它是否有效，但这会让你的应用程序非常慢。在我看来，最好只检查令牌在前端是否有效。这假定您的后端服务在每个请求上检查标记。由于前端的所有内容都可以修改，所以在你的前端没有保存的方法来处理这个问题。同样，只要确保您的后端在您的请求中检查您的令牌。

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean | Observable<boolean> { 
    if(localStorage.getItem('currentUser') && 
    JSON.parse(localStorage.getItem('currentUser')).expireTime < new Date().getTimeInMillis()){ //You need to have the expire value in your token. 
     return true; 
    } 

    this.router.navigate(['auth/login'], {queryParams: { returnUrl: state.url}}); 
}

来源

2017-12-18 14:41:55

好吧，我明白了。如果我如果我有角色呢？顺便说一句。谢谢你好。 – Amsel

简单地建立你的警惕。也许不是重定向，而是返回false。 –

Angular 5身份验证

回答

相关问题