只有在没有查询字符串时才激活 AuthenticationGuard
Activate AuthenticationGuard only if there's no query string
我构建了一个 Angular 7.0.4 单页应用程序,将由两种不同类型的用户访问。一种类型将在 Azure AD 上设置其身份,而另一种则不会。
因此,我的应用程序在为第一组用户启动时将使用 ADAL 对他们进行身份验证。对于第二组用户(没有 AD 身份),将有一个 windows 应用程序获取他们的登录信息,然后通过将他们的 ID 作为查询字符串参数传递来启动网站。
因此,对于第一批用户,我的网站 URL 将看起来像
https://my.application.com/
而对于第二组用户,它将是
https://my.application.com/?Id=12345
我正在尝试以仅在没有查询字符串参数时才进行身份验证的方式配置我的路由。
有什么办法可以实现吗?
谢谢,
什里拉姆
我已经为我的应用设置了 ADAL 并尝试以这种方式配置路由
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AuthenticationGuard } from 'microsoft-adal-angular6';
import { DashboardComponent } from './dashboard/dashboard.component';
const routes: Routes = [
{ path: '', component: DashboardComponent, pathMatch: 'full', canActivate: [AuthenticationGuard] },
{ path: '?Id', component: DashboardComponent}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
但即使我传递了查询字符串参数,它仍然对请求进行身份验证。
您的带有查询字符串参数的请求仍在访问 AuthenticationGuard,因为您的路由是这样设置的。 RouterModule 不关心是否有查询参数,并且始终路由到您示例中的空路径。
因此,为了防止 AuthenticationGuard 使用 'Id' 阻止您的请求,您需要将路由更改为:
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AuthenticationGuard } from 'microsoft-adal-angular6';
import { DashboardComponent } from './dashboard/dashboard.component';
const routes: Routes = [
{ path: '', component: DashboardComponent, pathMatch: 'full', canActivate: [AuthenticationGuard] },
// { path: '?Id', component: DashboardComponent} <=== remove this line
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
然后你可以像这样在 AuthenticationGuard 中放置一个 if-else 语句:
import { AuthenticationService } from "./authentication.service";
import { CanActivate, RouterStateSnapshot, ActivatedRouteSnapshot, Router, CanLoad, Route } from "@angular/router";
import { Injectable } from "@angular/core";
@Injectable()
export class AuthenticationGuard implements CanActivate {
constructor(private authenticationService: AuthenticationService,
private route: Router) {}
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
if (state.url.indexOf('Id') > -1 { // Id exists
return true;
}
else {
// rest of your logic here
}
}
}
希望对您有所帮助。
我构建了一个 Angular 7.0.4 单页应用程序,将由两种不同类型的用户访问。一种类型将在 Azure AD 上设置其身份,而另一种则不会。
因此,我的应用程序在为第一组用户启动时将使用 ADAL 对他们进行身份验证。对于第二组用户(没有 AD 身份),将有一个 windows 应用程序获取他们的登录信息,然后通过将他们的 ID 作为查询字符串参数传递来启动网站。
因此,对于第一批用户,我的网站 URL 将看起来像
https://my.application.com/
而对于第二组用户,它将是
https://my.application.com/?Id=12345
我正在尝试以仅在没有查询字符串参数时才进行身份验证的方式配置我的路由。
有什么办法可以实现吗?
谢谢, 什里拉姆
我已经为我的应用设置了 ADAL 并尝试以这种方式配置路由
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AuthenticationGuard } from 'microsoft-adal-angular6';
import { DashboardComponent } from './dashboard/dashboard.component';
const routes: Routes = [
{ path: '', component: DashboardComponent, pathMatch: 'full', canActivate: [AuthenticationGuard] },
{ path: '?Id', component: DashboardComponent}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
但即使我传递了查询字符串参数,它仍然对请求进行身份验证。
您的带有查询字符串参数的请求仍在访问 AuthenticationGuard,因为您的路由是这样设置的。 RouterModule 不关心是否有查询参数,并且始终路由到您示例中的空路径。
因此,为了防止 AuthenticationGuard 使用 'Id' 阻止您的请求,您需要将路由更改为:
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AuthenticationGuard } from 'microsoft-adal-angular6';
import { DashboardComponent } from './dashboard/dashboard.component';
const routes: Routes = [
{ path: '', component: DashboardComponent, pathMatch: 'full', canActivate: [AuthenticationGuard] },
// { path: '?Id', component: DashboardComponent} <=== remove this line
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
然后你可以像这样在 AuthenticationGuard 中放置一个 if-else 语句:
import { AuthenticationService } from "./authentication.service";
import { CanActivate, RouterStateSnapshot, ActivatedRouteSnapshot, Router, CanLoad, Route } from "@angular/router";
import { Injectable } from "@angular/core";
@Injectable()
export class AuthenticationGuard implements CanActivate {
constructor(private authenticationService: AuthenticationService,
private route: Router) {}
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
if (state.url.indexOf('Id') > -1 { // Id exists
return true;
}
else {
// rest of your logic here
}
}
}
希望对您有所帮助。