typescript - Angular OAuthModule 配置工廠

我需要為 OAuthModule 配置動態 URL，以便在每次請求時發送訪問令牌。我正在使用的解決方案（提示），通過工廠方法提供 OAuthModuleConfig，似乎不起作用。

這是我配置所有內容的 AppModule：

import {BrowserModule} from '@angular/platform-browser';
import {APP_INITIALIZER, NgModule} from '@angular/core';
import {AppRoutingModule} from './app-routing.module';
import {AppComponent} from './app.component';
import {OAuthModule, OAuthModuleConfig} from 'angular-oauth2-oidc';
import {HttpClientModule} from '@angular/common/http';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {MaterialModule} from './material/material.module';
import {DataSharingService} from './data-sharing/data-sharing.service';
import {EnvironmentService} from './environment/environment.service';
import {environment} from '../environments/environment';
import {ApiModule, BASE_PATH} from '@api/api-client';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    APIModule,
    HttpClientModule,
    OAuthModule.forRoot(),
    BrowserAnimationsModule,
    MaterialModule
  ],
  providers: [
    {
      provide: APP_INITIALIZER,
      useFactory: appInitializerFactory,
      deps: [EnvironmentService, DataSharingService],
      multi: true
    },
    {
      provide: OAuthModuleConfig,
      useFactory: oAuthModuleConfigFactory,
      deps: [DataSharingService]
    },
    {
      provide: BASE_PATH,
      useFactory: basePathFactory,
      deps: [DataSharingService]
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
}

function appInitializerFactory(environmentService: EnvironmentService, dataSharingService: DataSharingService): () => Promise<void> {
  return () => environmentService.getEnvironment(environment.production)
    .toPromise()
    .then(value => {
      dataSharingService.apiBasePath.next(value.API_BASE_PATH);
    });
}

function oAuthModuleConfigFactory(dataSharingService: DataSharingService): OAuthModuleConfig {
  return {
    resourceServer: {
      allowedUrls: [dataSharingService.apiBasePath.value],
      sendAccessToken: true
    }
  };
}

function basePathFactory(dataSharingService: DataSharingService): string {
  return dataSharingService.apiBasePath.value;
}

我認為我應該將此配置傳遞給 imports 中的 OAuthModule.forRoot() 方法，但我不知道如何做。

我該如何將提供的 OAuthModuleConfig 傳遞給 OAuthModule.forRoot()？

答案＃1

你很接近，這是你應該在 Angular 17 中導入 OAuthModule 的方法

import {
    OAuthModule,
    OAuthModuleConfig,
} from 'angular-oauth2-oidc';

/*...*/

export const appConfig: ApplicationConfig = {
providers: [
        importProvidersFrom(OAuthModule.forRoot()),
        /* ...add here the part to provide your DataSharingService */
        {
            provide: OAuthModuleConfig,
            useFactory: oAuthModuleConfigFactory,
            deps: [DataSharingService]
        },
]
}