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

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广告登录页面，或者如果我对this.adalService.init("HARDOCDE all values")的configOptions进行硬编码，那么它会正常工作。如何使应用程序阻止配置。我将配置值存储在/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));
}
}

请注意，这不是确切的更改，而是您需要执行的更改方向。希望这能有所帮助。