当我登录时，redirectTo 无法重定向到带有 canActivate 的链接
.
当我注销时，redirectTo 工作正常，它在登录后重定向到我的 /login 组件和 redirectTo 到 /index。
但是当我登录时它坚持 '' 。
我已经将 console.log 添加到我的 authGuard 中，并且重定向 url "/index"确实在坚持 '' 的情况下进入了该函数，开发工具没有崩溃。
但是在评论 canActivate 之后，redirectTo 像以前一样工作正常。
顺便说一句，我的带有 canActivate 的 authGuard 在其他情况下工作正常(排除 redirecTo )
这是我的 app-routing.module.ts
/* import... */
const appRoutes: Routes = [
{ path: 'login', component: LoginComponent },
{ path: '', redirectTo : '/index', pathMatch: 'full' },
{ path: '**', component: PageNotFoundComponent }
];
/* ngmodel and export ... */
这是我的 index-routing.module.ts
/* import ... */
const indexRoutes: Routes = [
{
path: 'index',
component: IndexComponent,
canActivate: [AuthGuard], //<- if comment this will work
},
];
/* ngmodel and export ... */
这是我的 auth-guard.module.ts
/* import ... */
@Injectable()
export class AuthGuard implements CanActivate {
constructor(
private authService: AuthService,
private router: Router
) { }
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
let url: string = state.url;
//redirectTo did get in here
console.log(url); //<-- this show /index
return this.checkLogin(url);
}
checkLogin(url: string): boolean {
if (this.authService.login_data && (this.authService.login_data.userprofile || !this.authService.login_data.need_login)) {
return true;
}
this.authService.get_login_data()
.subscribe(
data => {
this.authService.login_data = data;
if (data.userprofile || !data.need_login) {
return true;
}
this.authService.redirectUrl = url;
this.router.navigate(['/login']);
return false;
},
error => { this.authService.errMsg = <any>error;}
);
}
}
顺便说一句，我已将我的项目更新为 angular4.0.1
谢谢。
更新:
我已将我的保护返回值从 bool 值更改为可观察值
但它仍然不起作用。
这是我使用的代码。
checkLogin(url: string): Observable<boolean> {
if (this.authService.login_data && (this.authService.login_data.userprofile || !this.authService.login_data.need_login)) {
console.log('gonna return observable true');
return Observable.of(true);
//return true;
}
this.authService.get_login_data()
.subscribe(
data => {
this.authService.login_data = data;
if (data.userprofile || !data.need_login) {
console.log('in subscribe and gonna return observable true');
return Observable.of(true);
//return true;
}
this.authService.redirectUrl = url;
this.router.navigate(['/login']);
return Observable.of(false);
//return false;
},
error => { this.authService.errMsg = <any>error;}
);
}
在我的控制台中，我得到了
in subscribe and gonna return observable true更新:
检查后检查后
AuthGuard doesn't wait for authentication to finish before checking user
问题可能是
canActivate 不等待订阅结束。 最佳答案
在你 checkLogin() 的 AuthGuard 中:
checkLogin(url: string): boolean {
if (this.authService.login_data && (this.authService.login_data.userprofile || !this.authService.login_data.need_login)) {
return true;
}
this.authService.get_login_data()
.subscribe(
data => {
this.authService.login_data = data;
if (data.userprofile || !data.need_login) {
return true;
}
this.authService.redirectUrl = url;
this.router.navigate(['/login']);
return false;
},
error => { this.authService.errMsg = <any>error;}
);
}
它的返回类型是 bool 值，它返回真，在某些情况下，它是可以的。但是，后面的部分有一些问题。您没有返回任何内容，直到您订阅结果并根据该结果返回。
这意味着，此函数将返回 undefined，因此 canActivate 检查将不起作用。
[更新] 你想从结果中设置用户数据，你应该在你的
do() 中使用 authService.get_login_data() 来设置它。当您订阅结果时，将调用此“do”函数。并且在您的 checkLogin() 中使用 .map() 而不是 subscribe() 将登录结果数据映射到 bool 值。在这种情况下，您应该返回一个 Observable 类型，例如:
checkLogin(url: string): Observable<boolean> {
if (this.authService.login_data && (this.authService.login_data.userprofile || !this.authService.login_data.need_login)) {
return Observable.of(true); // wrap true in Observable
}
return this.authService.get_login_data()
.map(
data => {
if (data.userprofile || !data.need_login) {
return true;
}
this.authService.redirectUrl = url;
this.router.navigate(['/login']);
return false;
},
error => { this.authService.errMsg = <any>error;}
);
}
关于Angular 2 redirectTo 在重定向到带有 canActivate 的链接时不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43928963/