0

I have a Vuejs app and I want to pass some Okta authentication secrets such as clientId at runtime. The following is my Auth setup:

Vue.use(Auth, {
  issuer: process.env.VUE_APP_ISSUER,
  clientId: process.env.VUE_APP_CLIENT_ID,  
  redirectUri: process.env.VUE_APP_HOST_URL + '/implicit/callback', // Handle the response from Okta and store the returned tokens.
  scopes: ['openid', 'profile', 'email'],
  pkce: true 
})

Right now I have .env file that contains those variables with their values:

VUE_APP_HOST_URL=http://localhost:8080
VUE_APP_ISSUER=https://dev-12345.okta.com/oauth2/default
VUE_APP_CLIENT_ID=12345

I have been able to dockerize my Vuejs app and run it with that setup. But now I want to externalize those 3 secrets. If I remove those 3 variables from my .env file and inject them from docker run command the VUE_APP_HOST_URL value is undefined based on my console log.

The following is my docker run command:

docker run -e VUE_APP_HOST_URL=http://localhost:8080 
-e VUE_APP_ISSUER=https://dev-12345.okta.com/oauth2/default 
-e VUE_APP_CLIENT_ID=1234
-p 8080:8080 ghcr.io/myapp:latest
Katlock
  • 1,200
  • 1
  • 17
  • 41
  • 1
    There is a detailed answer [here](https://stackoverflow.com/questions/59722631/passing-environment-variables-at-runtime-to-vue-js-application-with-docker-compo) for this case – LastM4N Apr 28 '22 at 06:14
  • Did you exposed the environment variables to the contained process in your docker file using `ARG VUE_APP_HOST_URL` then `ENV VUE_APP_HOST_URL ${VUE_APP_HOST_URL}` – Kapcash Apr 28 '22 at 07:27

0 Answers0