[Question]: Async provider loader with provideAuth

[Liotarne]

What Version of the library are you using?
Working with Angular 18+ and "angular-auth-oidc-client": "18.0.0",
...

Question
How can I implement the loader factory "provideAuth" with Angular 18 please ?

Here is my app.config.ts

export const appConfig: ApplicationConfig = {
  providers: [
    provideAuth({
      loader: {
        provide: StsConfigLoader,
        useFactory: () => new StsConfigHttpLoader(from(getAuthConfig()))
      }
    })
  ],
};

And the config loader:

const makeStsConfig = (realm): OpenIdConfiguration => {
  const config: OpenIdConfiguration = {
    // Interpreted config
  };

  return config;
};

export const getAuthConfig = async (): Promise<OpenIdConfiguration> => {
  const realm = await getRealm();
  return makeStsConfig(realm);
};

I followed the exemple here: https://statics.teams.cdn.office.net/evergreen-assets/safelinks/1/atp-safelinks.html

For an implementation with a static config. It works well with it but not when it comes with a loader.

I need to load the config dynamically and asynchronously.

Thanks for your help !

[pandanirio]

I am experiencing the same problem. Due to business requirements, I need to load the OIDC configuration from an API.

It worked with the HTTP loader in the old module implementation, but since upgrading to Angular 18, I cannot find a solution to use an async loader with provideAuth standalone implementation.

[timdeschryver]

You should be able to do it like this:

    provideAuth({
      loader: {
        provide: StsConfigLoader,
        useFactory: httpLoaderFactory, // 👈 your implementation to get the config
      }
    }),

// Example implementation:
export const httpLoaderFactory = (): StsConfigLoader => {
  const httpClient = inject(HttpClient)
  const config$ = httpClient
    .get<any>(
      `https://offeringsolutions-sts.azurewebsites.net/api/ClientAppSettings`
    )
    .pipe(
      map((customConfig: any) => {
        return {
          authority: customConfig.stsServer,
          redirectUrl: customConfig.redirect_url,
          clientId: customConfig.client_id,
          responseType: customConfig.response_type,
          scope: customConfig.scope,
          postLogoutRedirectUri: customConfig.post_logout_redirect_uri,
          startCheckSession: customConfig.start_checksession,
          silentRenew: customConfig.silent_renew,
          silentRenewUrl: customConfig.redirect_url + '/silent-renew.html',
          postLoginRoute: customConfig.startup_route,
          forbiddenRoute: customConfig.forbidden_route,
          unauthorizedRoute: customConfig.unauthorized_route,
          logLevel: LogLevel.Debug,
          maxIdTokenIatOffsetAllowedInSeconds:
          customConfig.max_id_token_iat_offset_allowed_in_seconds,
          historyCleanupOff: true,
          // autoUserInfo: false,
        };
      })
    );

  return new StsConfigHttpLoader(config$);
};

[Liotarne]

It works well !

Thanks for your help @timdeschryver !

I close this issue

PS: My problem was the call of useFactory as an arrow function.