使用Angular2慢慢但肯定地进步.现在我遇到了以下挑战.我想检查用户是否在每次页面更改时登录(换句话说,在每个组件的加载时).当然,我可以在每一个中实现OnInit接口,但这就是代码味道.
是否有任何有效的方法来执行应用程序的每个页面上所需的任何内容?我很想听听有关如何处理此任务的最佳实践的任何其他建议.
我正在使用这个库(https://auth0.com/blog/2015/11/10/introducing-angular2-jwt-a-library-for-angular2-authentication/)进行基于jwt的登录,我已经有了一个很好的服务类,它封装了所有与身份验证相关的功能.因此,实际检查用户登录的位置已经完成并经过测试.
谢谢,
如果你使用路由(似乎就是这种情况,因为你说:“每次更改页面都有”),你可以利用以下几点:
原文链接:https://www.f2er.com/angularjs/143557.html>创建一个自定义路由器出口(RouterOutlet的子类),用于检查其激活方法的身份验证.在这种情况下,您可以拥有全球性的东西.像这样的东西:
@Directive({ selector: 'auth-outlet' }) export class AuthOutlet extends RouterOutlet { (...) activate(oldInstruction: ComponentInstruction) { var url = this.parentRouter.lastNavigationAttempt; if (isAuthenticated()) { return super.activate(oldInstruction); } else { (...) } } }
有关详细信息,请参阅此问题:
> Angular 2 Authentication with child routes
>利用CanActivate装饰器检查是否可以激活组件.在您的情况下,您可以在此级别执行身份验证检查.
>还可以在RouterLink级别完成某些操作以显示/隐藏路由链接.在这种情况下,您可以根据相关路由配置和当前用户提示在这些链接上应用角色.有关详细信息,请参阅此问题:
> Angular2. How to hide(no-render) the link in the menu after check access?
这也可以在HTTP拦截器(一个扩展Http的类)中处理.在这种情况下,当请求正在执行时,您可以插入一些身份验证检查:
@Injectable() export class CustomHttp extends Http { constructor(backend: ConnectionBackend,defaultOptions: RequestOptions) { super(backend,defaultOptions); } request(url: string | Request,options?: RequestOptionsArgs): Observable<Response> { console.log('request...'); if (isAuthenticated()) { return super.request(url,options).catch(res => { // do something }); } else { // Redirect to login page // Or throw an exception: return Observable.throw(new Error(...)); } } (...) }
有关详细信息,请参阅此问题: