Есть ли способ для встроенного приложения Vue.js читать переменную среды, определенную в развертывании Kubernetes?

Итак, у меня есть проект, который строит 3 модуля кубернетов, соединяющихся друг с другом, а именно server, manager и browser, часть браузера реализована с использованием Vue.js, другие используют Python Flask.

У меня есть configMap, в которой хранятся адреса их служб, которые должны использоваться тремя:

apiVersion: v1
kind: ConfigMap
metadata:
  name: env-config
data:
  SERVER_ADDRESS: http://ai-recommender-service:3518
  MANAGER_ADDRESS: http://manager-service:2354

с browser часть развертывания выглядит следующим образом:

apiVersion: apps/v1
kind: Deployment
metadata:
  name: browser-deployment
  labels:
    app: browser
spec:
  replicas: 1
  selector:
    matchLabels:
      app: browser
  template:
    metadata:
      labels:
        app: browser
    spec:
      containers:
        - name: browser
          image: browser:latest
          imagePullPolicy: Never
          ports:
            - containerPort: 80
          env:
            - name: MANAGER_ADDRESS
              valueFrom:
                configMapKeyRef:
                  name: env-config
                  key: MANAGER_ADDRESS

В проекте Vue.js browser у меня есть .js файл, который пытается получить переменную env через:

const ServiceManagerUrl = process.env.MANAGER_ADDRESS;

Но это не работает.

Я знаю, что есть и другие способы, такие как создание файла .env с переменной с префиксом VUE_APP_ в корневой папке, а затем загрузка его, используя что-то вроде process.env.VUE_APP_MANAGER_ADDRESS, но есть ли какие-либо способы для Vue.js напрямую передать переменные среды через развертывание Kubernetes (поскольку они используются другими частями системы), не прибегая к созданию дополнительных файлов?

--- добавлен ---

Dockerfile of browser

# build stage
FROM node:14-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build

# production stage
FROM nginx:stable-alpine as production-stage
COPY --from=build-stage /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

person Ken Tsoi    schedule 06.11.2020    source источник
comment
Вы создаете статическую производственную сборку для контейнера browser?   -  person Matt    schedule 06.11.2020
comment
Да ты прав @ Матт   -  person Ken Tsoi    schedule 06.11.2020
comment
Таким образом, переменные среды на самом деле не применимы к статическим сборкам, если у вас нет какой-либо формы сервера приложений, чтобы забрать их и внедрить в контент, который будет доставлен.   -  person Matt    schedule 06.11.2020
comment
Сервер приложений, вероятно, многовато, nginx / apache также может записывать переменную среды в запрос. Но для этого вам нужно будет настроить / закодировать вещь.   -  person Matt    schedule 06.11.2020
comment
Извините, я должен отступить, переменные env могут применяться во время сборки Vue. Итак, у вас есть статическое значение MANAGER_ADDRESS, хранящееся в вашем образе контейнера. Их нельзя изменить после.   -  person Matt    schedule 06.11.2020
comment
Я чуть позже напишу ответ ...   -  person Matt    schedule 06.11.2020
comment
Спасибо @Matt, на случай, если я неправильно понимаю, что такое статическая производственная сборка, я добавил файл докеров browser.   -  person Ken Tsoi    schedule 06.11.2020
comment
Некоторые варианты уже есть в этом ответе.   -  person Matt    schedule 07.11.2020
comment
Спасибо @Matt, я попытался реализовать решение Hendrik M Halkow, но был немного сбит с толку (извините за то, что был новичком в Vue.js). Я не знаю, куда поместить <script src="<%= BASE_URL %>config.js"></script> и this.displayURL = config.VUE_APP_ENV_MyURL || process.env.VUE_APP_ENV_MyURL в моем .vue файле или .js файле? вы можете подробнее рассказать?   -  person Ken Tsoi    schedule 07.11.2020
comment
Позвольте нам продолжить это обсуждение в чате.   -  person Ken Tsoi    schedule 07.11.2020