angular - 带有意外参数的 Angular MSAL v2 重定向

Question

我正在使用 Active Directory 身份验证 (MSAL) 将我的 Angular 10 项目从 v1 升级到 v2。

配置似乎是正确的，因为我可以毫无问题地登录。

但是，当我登录时，我应该被重定向到一个特定的页面（这里是 localhost:4200/admin），就是这样，但是在 URI 中添加了很多参数，比如“code”（？），“客户端信息”、“状态”和“会话状态”。（由于内容的机密性，我不能给你确切的链接）。

在我刚刚登录的这种状态下，我被重定向到这个奇怪的链接，然后 Angular 将我重定向到主页，但是如果我已经登录，我被重定向到这个奇怪的链接，并且在我之后m 在没有所有这些参数的情况下重定向到 localhost:4200/admin。

有人对此有解释（显然是解决方案）吗？

如果您需要一些代码来帮助理解，请告诉我。

这是我的 app.module.ts ：

const isIE = window.navigator.userAgent.indexOf('MSIE ') > -1 || window.navigator.userAgent.indexOf('Trident/') > -1;

export function loggerCallback(logLevel: LogLevel, message: string): void {
  console.log(message);
}

export function loadSettings(AppInitializerService: AppInitializerService): any {
  return () => AppInitializerService.loadSettings();
}

registerLocaleData(localeFr, 'fr-FR');

export function MSALInstanceFactory(): IPublicClientApplication {
  return new PublicClientApplication({
    auth: {
      clientId: AppConfig.appSettings.authentication.clientId, //clientID from app registration
      authority: 'https://login.microsoftonline.com/' + AppConfig.appSettings.authentication.tenantName, //tenant name from my organisation
      redirectUri: 'http://localhost:4200/admin',
      postLogoutRedirectUri: AppConfig.appSettings.authentication.loginRedirectUrl //http://localhost:4200
    },
    cache: {
      cacheLocation: BrowserCacheLocation.LocalStorage,
      storeAuthStateInCookie: isIE
    },
    system: {
      loggerOptions: {
        loggerCallback,
        logLevel: LogLevel.Info,
        piiLoggingEnabled: false
      }
    }
  });
}

export function MSALInterceptorConfigFactory(): MsalInterceptorConfiguration {
  const protectedResourceMap = AppConfig.appSettings.authentication.protectedRessourceMap; //["http://localhost:4200/admin/**", ["api://SomeCoolId/Api"]]

  return {
    interactionType: InteractionType.Redirect,
    protectedResourceMap
  };
}

export function MSALGuardConfigFactory(): MsalGuardConfiguration {
  return {
    interactionType: InteractionType.Redirect,
    authRequest: {
      scopes: ['user.read']
    }
  };
}

@NgModule({
  declarations: [AppComponent, DialogComponent, RecapitulatifComponent, ErrorComponent],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    HttpClientModule,
    MDBBootstrapModule.forRoot(),
    LayoutCandidateModule,
    LayoutAdminModule,
    JobBoardsModule,
    SharedModule,
    NotionsModule,
    SkillsCentersModule,
    MsalModule
  ],
  exports: [],
  providers: [
    AppInitializerService,
    NotificationService,
    SpinnerService,
    {
      provide: APP_INITIALIZER,
      useFactory: loadSettings,
      deps: [AppInitializerService],
      multi: true
    },
    {
      provide: HTTP_INTERCEPTORS,
      useClass: MsalInterceptor,
      multi: true
    },
    {
      provide: MSAL_INSTANCE,
      useFactory: MSALInstanceFactory
    },
    {
      provide: MSAL_GUARD_CONFIG,
      useFactory: MSALGuardConfigFactory
    },
    {
      provide: MSAL_INTERCEPTOR_CONFIG,
      useFactory: MSALInterceptorConfigFactory
    },
    MsalService,
    MsalGuard,
    MsalBroadcastService
  ],
  bootstrap: [AppComponent, MsalRedirectComponent],
  entryComponents: [DialogComponent, RecapitulatifComponent]
})
export class AppModule {}

这是我的 admin.routing.module.ts

const routes: Routes = [
  {
    path: '',
    component: AdminComponent,
    canActivate: [MsalGuard]
  },
  {
    path: 'candidates',
    children: [
      {
        path: '',
        component: CandidatesComponent,
        resolve: {
          candidates: GetAllCandidatesResolver
        }
      },
      {
        path: ':id',
        children: [
          {
            path: '',
            component: CandidateComponent,
            resolve: {
              candidate: GetCandidateResolver,
              interlocutors: GetAllInterlocutorsResolver
            }
          },
          {
            path: 'recap-questions',
            component: RecapQuestionsComponent,
            resolve: {
              testThemes: GestTestThemesByCandidateResolver
            }
          }
        ]
      }
    ]
  },
  {
    path: 'interlocutors',
    children: [
      {
        path: '',
        component: InterlocutorsComponent,
        resolve: {
          interlocutors: GetAllInterlocutorsResolver
        }
      },
      {
        path: ':id',
        children: [
          {
            path: '',
            component: InterlocutorComponent,
            resolve: {
              interlocutor: GetInterlocutorResolver,
              notions: GetAllNotionsResolver,
              businessPoles: GetAllBusinessPolesResolver
            }
          }
        ]
      }
    ]
  },
  {
    path: 'create-interlocutor',
    children: [
      {
        path: '',
        component: CreateInterlocutorComponent,
        resolve: {
          notions: GetAllNotionsResolver,
          businessPoles: GetAllBusinessPolesResolver
        }
      }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class AdminRoutingModule {}

更新：此错误仅发生在 Firefox 中。用 Chrome 没问题