Error could not find matching config for state when using StsConfigHttpLoader

I am using angular-auth-oidc-client library v16.0.2 in angular project which is using v15.2.10. Everything works fine when I use static auth configs, but if I use async auth config, I get the error "could not find matching config for state ${stateParamFromUrl}" while authenticating the user.

• I have tried setting historyCleanupOff=false
• I am not using any angular-auth-oidc-client library authGuard
• Authentication is triggered, I get the code stops at callbackComponent (isAuthenticated$ subscription never returns and I get the error mentioned above).

auth-config.module.ts

/** Static config loading works perfectly fine */
export const StaticAuthConfigLoaderFactory = (): StsConfigLoader => {
const authConfig = {
triggerAuthorizationResultEvent: true,
forbiddenRoute: `${window.location.origin}/error`,
unauthorizedRoute: `${window.location.origin}/error`,
logLevel: LogLevel.Debug,
historyCleanupOff: false,
authority: 'https://mySSO.com',
redirectUrl: `${window.location.origin}/callback`,
postLogoutRedirectUri: `${window.location.origin}/logout`,
clientId: 'angular-test',
scope: 'openid profile',
responseType: 'code',
silentRenew: false,
useRefreshToken: true,
};
return new StsConfigLoader(authConfig);
}

/** Http config loading fails at callback */
export const HttpAuthConfigLoaderFactory = (httpClient: HttpClient): StsConfigLoader => {
const authConfigPath = `assets/config/auth-config.json`;
let authConfig$ = httpClient.get<OpenIdConfiguration>(authConfigPath)
.pipe(
catchError((err) => {
console.error('Failed to load auth config', err);
return throwError(err);
}),
map((customConfig: any) => {
const obj = {
authority: customConfig.authority,
redirectUrl: customConfig.redirectUrl,
clientId: customConfig.clientId,
responseType: customConfig.responseType,
scope: customConfig.scope,
postLogoutRedirectUri: customConfig.postLogoutRedirectUri,
silentRenew: false,
postLoginRoute: customConfig.postLoginRoute,
forbiddenRoute: customConfig.forbiddenRoute,
unauthorizedRoute: customConfig.unauthorizedRoute,
logLevel: LogLevel.Debug,
historyCleanupOff: false,
};
return obj;
})
);
return new StsConfigHttpLoader(authConfig$);
};
@NgModule({ imports: [
AuthModule.forRoot({
loader: {
provide: StsConfigLoader,
useFactory: HttpAuthConfigLoaderFactory,
deps: [HttpClient],
},
}),
],
exports: [AuthModule],
})

export class AuthConfigModule { }

Continue reading...