正如我在标题中所说,当应用程序部署在服务器上时,我无法在 Nuxt3 上获取环境变量。我在 Digital Ocean 服务器上运行该应用程序,并通过 Dockerfile 和 Github Action 脚本进行部署。
我知道 Nuxt 不会读取客户端的 env 变量,但我认为如果我在构建时附加 env,它会起作用,但到目前为止还没有成功。
我将在下面附上所有相关代码。我必须提到,如果我进入容器内部,将使用正确的值成功创建 .env 文件,并且“printenv”命令也会给我所有正确的值。
当我尝试在浏览器中运行该应用程序时,出现“无效的 firebase api 密钥”错误,这基本上是我的变量未被读取的标志。在本地主机上它工作正常。
我还为 envs 变量添加了前缀 NUXT_ 用于私有变量和 NUXT_PUBLIC_ 用于公共变量。
我还尝试从 Nuxt 端点(从服务器端)检索环境并且它正在工作,但是这些值将在网络选项卡内可用。
Dockerfile 片段:
FROM node:alpine AS base
WORKDIR /code
ARG NUXT_FIREBASE_API_KEY
ENV NUXT_FIREBASE_API_KEY=$NUXT_FIREBASE_API_KEY
RUN echo "NUXT_FIREBASE_API_KEY=$NUXT_FIREBASE_API_KEY" >> /code/.env
<other envs here>
# Stage 2 - builder
FROM base AS builder
WORKDIR /code
COPY package*.json ./
COPY ./ ./
COPY --from=base /code/.env /code/.env
RUN npm install
RUN npm run build
# Stage 3 - run
FROM base AS final
RUN apk add --no-cache \
git \
wget curl \
nginx \
supervisor
WORKDIR /code
ADD package.json ./
ADD nuxt.config.ts ./
ADD .docker/nuxt/nginx-app.conf ./
COPY --from=builder /code/.output /code/.output
COPY --from=builder /code/node_modules /code/node_modules
COPY --from=builder /code/.env /code/.env
RUN \
# copy nginx site config \
mv ./nginx-app.conf /etc/nginx/nginx.conf
EXPOSE 3000
CMD [ "node", ".output/server/index.mjs" ]
nuxt.config.ts:
runtimeConfig: {
FIREBASE_API_KEY: process.env.NUXT_FIREBASE_API_KEY,
FIREBASE_AUTH_DOMAIN: process.env.NUXT_FIREBASE_AUTH_DOMAIN,
FIREBASE_PROJECT_ID: process.env.NUXT_FIREBASE_PROJECT_ID,
FIREBASE_STORAGE_BUCKET: process.env.NUXT_FIREBASE_STORAGE_BUCKET,
FIREBASE_MESSAGE_SENDER_ID: process.env.NUXT_FIREBASE_MESSAGE_SENDER_ID,
FIREBASE_APP_ID: process.env.NUXT_FIREBASE_APP_ID,
FIREBASE_MEASUREMENT_ID: process.env.NUXT_FIREBASE_MEASUREMENT_ID,
public: {
BASE_URL_API: process.env.NUXT_PUBLIC_BASE_URL_API,
HOST: '0.0.0.0'
}
Docker 命令:
run: >
docker build --build-arg NUXT_FIREBASE_SERVICE_ACCOUNT_JSON=$(echo $FIREBASE_SERVICE_ACCOUNT_JSON)
--build-arg NUXT_FIREBASE_API_KEY=$(echo $FIREBASE_API_KEY)
--build-arg NUXT_FIREBASE_AUTH_DOMAIN=$(echo $FIREBASE_AUTH_DOMAIN)
--build-arg NUXT_FIREBASE_PROJECT_ID=$(echo $FIREBASE_PROJECT_ID)
--build-arg NUXT_FIREBASE_STORAGE_BUCKET=$(echo $FIREBASE_STORAGE_BUCKET)
--build-arg NUXT_FIREBASE_MESSAGE_SENDER_ID=$(echo $FIREBASE_MESSAGE_SENDER_ID)
--build-arg NUXT_FIREBASE_APP_ID=$(echo $FIREBASE_APP_ID)
--build-arg NUXT_FIREBASE_MEASUREMENT_ID=$(echo $FIREBASE_MEASUREMENT_ID)
--build-arg NUXT_PUBLIC_BASE_URL_API=$(echo $BASE_URL_API)
-t $(echo $REGISTRY)/$(echo $IMAGE_NAME):$(echo $REF-$(echo $SHA | head -c7)) -f .docker/nuxt/Dockerfile .
运行命令:
docker run -d \
-p 3030:3000 \
--restart always \
--name $(echo $IMAGE_NAME) $(echo $REGISTRY)/$(echo $IMAGE_NAME):$(echo $REF-$(echo $SHA | head -c7))