[英]Angular routing with login to Identity server
我正在嘗試設置 Angular 和身份服務器。 這個應用程序真的有兩條路線。 項目列表和項目詳細信息。
這兩個頁面都需要保護。 現在它有點工作。 當我到達http://localhost:4200時,它將顯示帶有 header 但沒有項目數據的項目列表頁面。 大約一兩秒后,它重定向到身份服務器登錄頁面。
我不希望它顯示帶有 header 的項目列表頁面,我希望它直接顯示為 go 到登錄頁面。
const routes: Routes = [
{
path: "project-list",
component: ProjectlistComponent,
canActivate: [AuthorizationGuard]
},
{
path: "project-details/:id",
component: ProjectDetailsComponent,
canActivate: [AuthorizationGuard]
},
{
path: "",
redirectTo: "project-list",
pathMatch: "full"
}
如果用戶未通過身份驗證,則在 AuthorizationGuard 中重定向到自動登錄
private checkUser(): any {
console.log('AuthorizationGuard, canActivate');
return this.oidcSecurityService.getIsAuthorized().pipe(
tap((isAuthorized: boolean) => {
console.log('AuthorizationGuard, canActivate isAuthorized: ' + isAuthorized);
if (!isAuthorized) {
this.router.navigate(['/autologin']);
}
})
);
}
有沒有更好的方法而不重定向到自動登錄?
import { Component, OnInit, OnDestroy } from "@angular/core";
import { OidcSecurityService } from "angular-auth-oidc-client";
@Component({
selector: "app-auto-component",
templateUrl: "./auto-login.component.html"
})
export class AutoLoginComponent implements OnInit, OnDestroy {
lang: any;
constructor(public oidcSecurityService: OidcSecurityService) {
this.oidcSecurityService.onModuleSetup.subscribe(() => {
this.onModuleSetup();
});
}
ngOnInit() {
if (this.oidcSecurityService.moduleSetup) {
this.onModuleSetup();
}
}
ngOnDestroy(): void {}
private onModuleSetup() {
this.oidcSecurityService.authorize();
}
}
我假設您authgaurd
如果不是必須返回checkUser()
那么您必須在 pipe 中返回 Boolean 所以將您的checkUser()
更改為
private checkUser(): Observable<bool>{
return this.oidcSecurityService.getIsAuthorized().pipe(
map((isAuthorized: boolean) => {
if (!isAuthorized) {
this.router.navigate(['/autologin']);
}
return isAuthorized;
})
);
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.