How to use ENV Variables Declared on Google Cloud Run Dashboard in React

Question

I am deploying a create-react-app Service onto Google Cloud Run using a Dockerfile, but I want to move away from declaring env variables in a.env file, and instead, declare them on Google Cloud Run's Dashboard like so:

However, when I call the env var using

console.log("REDIRECT", process.env.REACT_APP_REDIRECT_URI)

null is returned for any env variable I try to reference. Is there another step to access these variables that I am missing?

Here is my Dockerfile:

FROM node:10-alpine as react-build
WORKDIR /app
COPY . ./
RUN yarn
RUN yarn build

FROM nginx:alpine
COPY nginx.conf /etc/nginx/conf.d/configfile.template
ENV PORT 8080 
ENV HOST 0.0.0.0
RUN sh -c "envsubst '\$PORT'  < /etc/nginx/conf.d/configfile.template >      /etc/nginx/conf.d/default.conf"
COPY --from=react-build /app/build /usr/share/nginx/html
EXPOSE 8080
CMD ["nginx", "-g", "daemon off;"]

Answer 1

Your container serve only static files (through NGINX) and no processing is performed on Cloud Run side.

Actually, you expose your static file to your users. The users get the files and load them in their browser. The users' browser execute the Javascript and read the Env Variable on the current environment: the users' browser.

Therefore, the Cloud Run env var aren't use in this use case. You have to perform a processing on Cloud Run to use the Cloud Run env variables.