Angular 6 + Nginx + Docker + Kubernetes：如何为不同环境配置环境变量

Question

我有一个 Angular 6 应用程序，需要将其作为 Docker 容器（Nginx 基础映像）部署到 Kubernetes 集群上。

问题：如何适应使用一次构建的相同 Docker 映像，但能够在开发和生产中运行并指向不同的 API_URL？

我的环境文件：

环境.ts

export const environment = {
  production: false,
  API_URL: 'https://dev-server.domain.com'
};

环境.产品.ts

export const environment = {
  production: true,
  API_URL: 'https://prod-server.domain.com'
};

我的nginx.conf

worker_processes 1;

events {
    worker_connections 1024;
}

http {
    server {
        listen 80;
        server_name localhost;

        root   /usr/share/nginx/html;
        index  index.html index.htm;
        include /etc/nginx/mime.types;

        gzip on;
        gzip_min_length 1000;
        gzip_proxied expired no-cache no-store private auth;
        gzip_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;

        location / {
            try_files $uri $uri/ /index.html;
        }
    }
}

我的Dockerfile：

# base image
FROM nginx:alpine

# private and public mapping
EXPOSE 80

COPY nginx.conf /etc/nginx/nginx.conf

WORKDIR /usr/share/nginx/html
COPY dist/my_project .

此时，我在本地计算机上构建项目并针对生产进行优化：

ng build --prod --build-optimizer

所以，此时我的文件结构如下所示：

root
    |--Dockerfile
    |--nginx.conf
    |--angular.json
    |--dist
       |--my_project
          |--styles.3ed0e5393a1386f6fc48.css
          |--runtime.a66f828dca56eeb90e02.js
          |--polyfills.2f5aa8fb3d2aea854d83.js
          |--main.2b3e9b16d82428586ae5.js
          |--index.html
          |--favicon.ico
          |--3rdpartylicenses.txt
          |--assets

现在，我准备创建 docker 镜像：

docker build -t my_application_image .

然后，我将镜像推送到 Docker 注册表，然后在 Kubernetes 中使用。

现在您知道了我的设置，您能否建议我如何修改它，以便不同的环境文件可用于开发和生产？

Answer 1

解决此问题的方法之一是将入口点脚本添加到您的 docker 映像和默认的产品环境中。仅使用一种environment.ts，例如：

export const environment = {
  production: {{production}},
  API_URL: '{{api_url}}'
};

Dockerfile 与

ENV PRODUCTION=true API_URL=https://prod-server.domain.com
ADD entrypoint.sh /entrypoint.sh
ENTRYPOINT /entrypoint.sh

最后是入口点本身

#!/bin/bash
sed -i "s/{{production}}/${PRODUCTION}/g" environment.ts
sed -i "s/{{api_url}}/${API_URL}/g" environment.ts
exec $@