Как я могу получить доступ к переменным среды в Vue, которые передаются в контейнер во время выполнения, а не во время сборки?
Стек выглядит следующим образом:
- VueCLI 3.0.5
- докер
- Kubernetes
Существуют предлагаемые решения для stackoverflow и в других местах для использования файла .env для передачи переменных (и использования режима), но это во время сборки и запекается в образ докера.
Я хотел бы передать переменную в Vue во время выполнения следующим образом:
- Создайте Kubernetes ConfigMap (я правильно понял)
- Передайте значение ConfigMap в переменную env K8s pod при запуске файла развертывания yaml (я правильно понял)
- Чтение из переменной env, созданной выше, например. VUE_APP_MyURL и сделайте что-нибудь с этим значением в моем приложении Vue (я не понимаю это правильно)
Я попробовал следующее в helloworld.vue:
<template>
<div>{{displayURL}}
<p>Hello World</p>
</div>
</template>
<script>
export default {
data(){
return{
displayURL:""
}
},
mounted(){
console.log("check 1")
this.displayURL=process.env.VUE_APP_ENV_MyURL
console.log(process.env.VUE_APP_ENV_MyURL)
console.log("check 3")
}
}
</script>
Я возвращаю "undefined" в журнале консоли и ничего не отображается на странице helloworld.
Я также попытался передать значение в файл vue.config и прочитать его оттуда. Тот же "неопределенный" результат в console.log
<template>
<div>{{displayURL}}
<p>Hello World</p>
</div>
</template>
<script>
const vueconfig = require('../../vue.config');
export default {
data(){
return{
displayURL:""
}
},
mounted(){
console.log("check 1")
this.displayURL=vueconfig.VUE_APP_MyURL
console.log(vueconfig.VUE_APP_MyURL)
console.log("check 3")
}
}
</script>
С vue.config выглядит так:
module.exports = {
VUE_APP_MyURL: process.env.VUE_APP_ENV_MyURL
}
Если я жестко закодирую значение в VUE_APP_MyURL в файле vue.config, оно будет успешно отображено на странице helloworld.
VUE_APP_ENV_MyURL успешно заполняется правильным значением, когда я его опрашиваю: kubectl description pod
process.env.VUE_APP_MyURL, похоже, не может успешно получить значение.
Для чего это стоит... Я могу успешно использовать process.env.VUE_APP_3rdURL для передачи значений в приложение Node.js во время выполнения.