在我的Angular2应用程序中,我使用canActivate来允许访问页面。 其中一部分是与服务器核实令牌没有被篡改,所以在我可以决定用户可以被授予访问权限之前,我需要打电话给我的api。 这意味着订阅Observable并等待回答。
我需要返回true或false,但是因为我打了一个asyns电话,我不能根据我的回复返回。 我意识到我不能等待,因为它是单线程的,但我需要以某种方式阻止,直到我从api回复。 我的canActivate看起来如下:
canActivate() {
this.guardClient.checkToken("token")
.subscribe(response => {
let responseText = response.text().replace(/"/g, '');
if ( responseText === 'Ok')
{
return true;
}
if(responseText === 'denied') {
this.router.navigate(['login']); // redirecting to login
return false;
}
});
}
有人能告诉我如何解决这个问题吗?
答案 0 :(得分:1)
在角度2中查看CanActivate界面时,我看到以下内容:
export interface CanActivate {
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean;
}
如您所见,您也可以返回一个Observable,而不仅仅是一个布尔值。 这意味着您的代码可以像这样重写。
canActivate() {
return this.guardClient.checkToken("token")
.map(response => {
let responseText = response.text().replace(/"/g, '');
if ( responseText === ' Ok')
{
return true;
}
if(responseText === 'denied') {
this.router.navigate(['login']); // redirecting to login
return false;
}
});
}
这将使Angular在决定是否可以显示路径之前等待observable解析。 请注意,此方法应该非常快,以避免缓慢加载。