[如何使用Angular 7中的配置设置来填充Adal8Service的configOptions并在应用程序加载时加载

Question

我正在使用import { Adal8Service, Adal8HTTPService } from 'adal-angular8';进行Azure身份验证。我在app.module.ts中使用以下内容：

export function appInit(appConfigService: AppInitService) {
  return (): any => {
    appConfigService.getApplicationConfig().subscribe((res) =>{
      sessionStorage.setItem("appConfig",JSON.stringify(res));
      timeout(500);
    });
  }
}

我的getApplicationConfig（）如下：

public getApplicationConfig() {
    return this.http.get('assets/config.json');}

以及providers []中的以下内容：

 AuthenticationService,
    AppInitService,
    {
      provide: APP_INITIALIZER,
      useFactory: appInit,
      deps: [AppInitService],
      multi: true
    },
    Adal8Service, 
    { provide: Adal8HTTPService, 
      useFactory: Adal8HTTPService.factory, 
      deps: [HttpClient, Adal8Service],
      multi: true 
    },

这里是appInit函数不会阻止（甚至删除timeout（））应用程序加载并继续到

this.adalService.init(this.adalConfig);
 this.adalService.handleWindowCallback();

（其中this.adalConfig = sessionStorage.getItem("appConfig")）。

如果刷新页面，则可以正确地重定向到Azure广告登录页面，或者如果我对configOptions的this.adalService.init("HARDOCDE all values")进行硬编码，则可以正常工作。如何使应用程序阻止配置。我将配置值存储在/assets/config.json下。我不确定我在做什么错。我确实尝试读取“ json”文件，但是再次必须将其更改才能进行生产。如何使应用程序等待，/assets/config.json文件中还存储了应用程序的其他配置值。我使用APP_INITIALIZER的方式是否正确？请指出正确的方向。

Answer 1

问题与ADAL不相关，但与javascript中异步函数的工作方式有关。为了阻止该函数的执行，您可以写下一个函数以等待http请求返回响应，也可以使用waitfor-ES6之类的库来帮助您完成该任务。

需要在]进行更改>

export function appInit(appConfigService: AppInitService) {
  return (): any => {
    response = yield wait.for(appConfigService.getApplicationConfig);
    sessionStorage.setItem("appConfig",JSON.stringify(response));
  }
}
请注意，这不是确切的更改，而是您需要执行的更改方向。希望这会有所帮助。