私のアプリにユーザーログインができたら、必然的にポータルページにリダイレクトする必要があります。しかし、router.navigate()を呼び出すと3つのことが起こります... 1)アプリケーションは/ portalにリダイレクトされます。 2)その後、アプリケーションは即座に電子メールアドレスとパスワードをクエリー文字列として/ portalに再度リダイレクトします。 3)appは、appState.User(ユーザーが既にログインしていることを完全に「忘れている」)を失って、何らかの形で「リセット」しているように見えるので、元のログインページにリダイレクトされます。ここで何が問題なの?フォーム提出後に即座にポータルにルーティングすることができない
これはすべて、このボタンによってトリガーされます、フォームのonSubmitの内部で起こっている:
<button type="submit" (click)="onSubmit(Form)">Sign in</button>
ここをonSubmitコードです:
public onSubmit(form: EmailForm): void {
this.apiLogin.LoginUser(form.EmailAddress, form.Password).subscribe(
(user: LoginUser) => {
if(user.UserToken == null) {
this.addValidationError("Invalid username and/or password.");
}
else {
this.appState.setUser(user);
}
},
(err) => {},
() => {
this.router.navigate(['/portal']);
}
);
}
ここに私のルート設定が...同様
だが、const appRoutes: Routes = [
{ path: '', component: HomeComponent, pathMatch: 'full' },
{ path: 'portal', component: PortalComponent, canActivate: [AuthGuard] },
{ path: '**', component: PageNotFoundComponent }
];
これは必要ではないかもしれませんが、私がポータルルートで使用しているAuthGuardサービスです。ありがとう@ Sasxa helping me setup this AuthGuardのために。
@Injectable()
export class AuthGuard implements CanActivate {
constructor(private appState: ApplicationState, private router: Router) {}
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
let url: string = state.url;
return this.checkLogin(url);
}
checkLogin(url: string): boolean {
if (this.appState.User.UserToken) return true;
this.navToLogin(url);
return false;
}
private navToLogin(redirUrl: string) {
this.router.navigate(['/']);
}
} // end class