角度& Docker:环境感知配置 [英] Angular & Docker: Environment aware configuration

问题描述

我们目前正在使用Angular 4设置SPA，并在Azure上使用Docker托管它.通常，如果我们使用Angular-CLI build命令，则使用Angular使用环境配置来设置环境(Prod，Development，Testing).很棒，但是Docker的工作流程有些不同:

We'recurrently setting up an SPA with Angular 4, hosting it with Docker on Azure. Usually, the environments (Prod, Development, Testing) are set in Angular with the Environment-Configs, which are compiled, if we use the Angular-CLI build command. This is great, but the workflow with Docker is a bit different:

1. 构建Angular应用
2. 初始化Docker容器
3. 设置Docker容器环境变量
4. 启动Docker容器

这意味着我们遇到了计时问题，因为在编译时，我们不能说App将在哪个环境上运行.对于服务器(.net核心)来说，这没问题，因为我们可以使用ASPNETCORE_ENVIRONMENT变量，但是我们没有找到使应用程序了解环境类型的解决方案. 我几乎可以肯定，我们不是唯一遇到此问题的人，但是到目前为止，我还没有找到合适的解决方案.我们不知道周围是否存在某种可能性?

This means we have a timing problem, because on compile-time, we can't say, on which environment the App will run. For the server (.net core), this is no problem, since we can use the ASPNETCORE_ENVIRONMENT variable, but we didn't find a solution to make the App aware of the environment-type. I'm almost certain we're not the only people around with this problem, yet I didn't find proper solution so far. Is there some possibility around we aren't aware of?

推荐答案

由于我的主要目标是不为每个环境创建一个Container，而是使构建过程与环境无关，所以我提出了以下解决方案: 我正在使用docker-stack文件添加命令(我的Docker映像为NGinx):

Since my main goal was to not create a Container per environment but also to keep the build process environment-agnostic, I came up with the following solution: I'm using the docker-stack file to add a command (My Docker image is NGinx):

command: /bin/bash -c "cp /usr/share/nginx/html/assets/app-settings/appsettings.__EnvironmentName__.json /usr/share/nginx/html/assets/app-settings/appsettings.json && find "/usr/share/nginx/html/assets/app-settings/" -type f -name "*.json" -not -name "appsettings.json" -exec rm {} ';' && exec nginx -g 'daemon off;'"

该命令执行三件事:

1. 将特定于环境的appsettings.json(如下所示)复制为 appsettings.json
2. 删除所有appsettings.xxx.json，除了 appsettings.json
3. 启动nginx

1. Copy a environment specific appsettings.json (see below) as appsettings.json
2. Remove all appsettings.xxx.json except appsettings.json
3. Start nginx

发布过程还将 EnvironmentName 替换为其部署到的特定环境.这意味着，每个容器现在都具有一个appsettings.json文件，其中包含特定于环境的数据. 在有角度的代码上，我仅使用环境文件来获取与编译时，环境无关的信息:

The release process also replaces EnvironmentName with the specific environment it is deploying to. This means, each container has now an appsettings.json in place with the environment-specific data. On the angular code, I'm using the environment-files just for compile-time, environment-agnostic, information:

export const environment = { production: false };

export const environment = { production: false };

应用设置另存为资产:

要读取appsettings.json的运行时信息，我已使用本地http调用创建了一个appsettings提供程序服务:

To read the runtime information of appsettings.json, I've created a appsettings provider service, using a local http call:

@Injectable()
export class AppSettingsProviderService {
  private appSettings: AppSettings;

  public constructor(private http: LocalHttpService) {
  }

  public async provideAppSettingsAsync(): Promise<AppSettings> {
    if (this.appSettings) {
      return Promise.resolve(this.appSettings);
    }

    // This path needs to be relative to the files in the dist-folder
    this.appSettings = await this.http.getAsync<AppSettings>('./assets/app-settings/appsettings.json');
    return this.appSettings;
  }
}

这在开发过程中也有效，因为在这种情况下仅使用appsettings.json，即使使用ng serve，代码也将编译为dist，这意味着相对路径仍然正确.

This works also during development, since just the appsettings.json is used in this case and even with ng serve, the code is compiled into dist, meaning the relative path is still correct.

这篇关于角度& Docker:环境感知配置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！