reactjs - 在我的下一个 js 应用程序的后端或前端中无法访问 azure 的应用程序设置

Question

我有一个想要在 azure 应用服务上托管的下一个 js 应用程序。我已经设置了一个 dockerfile 来运行该应用程序，如下所示:

# Install dependencies only when needed
FROM node:14.15.5-alpine AS deps
# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
RUN apk add --no-cache libc6-compat
WORKDIR /app
COPY package.json yarn.lock ./
RUN yarn install --frozen-lockfile
 
# Rebuild the source code only when needed
FROM node:alpine AS builder
WORKDIR /app
COPY . .
COPY --from=deps /app/node_modules ./node_modules
RUN yarn build:testing
 
# Production image, copy all the files and run next
FROM node:alpine AS runner
WORKDIR /app
 
ENV NODE_ENV production
 
# You only need to copy next.config.js if you are NOT using the default configuration
COPY --from=builder /app/next.config.js ./next.config.js
COPY --from=builder /app/next-i18next.config.js ./next-i18next.config.js
COPY --from=builder /app/public ./public
COPY --from=builder /app/.next ./.next
COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/package.json ./package.json
 
RUN addgroup -g 1001 -S nodejs
RUN adduser -S nextjs -u 1001
RUN chown -R nextjs:nodejs /app/.next
USER nextjs
 
EXPOSE 3000
 
# Next.js collects completely anonymous telemetry data about general usage.
# Learn more here: https://nextjs.org/telemetry
# Uncomment the following line in case you want to disable telemetry.
# RUN npx next telemetry disable
 
CMD ["yarn", "start:testing"]

docker 镜像已构建并从 bitbucket 管道推送到 azure。图像运行良好，推送进展顺利。我正在使用 Microsoft 自己提供的代码 https://bitbucket.org/microsoft/azure-web-apps-containers-deploy/src/master/ 进行推送.

我的问题在于应用服务中设置的应用设置在 Azure 上托管的应用程序中不可用。我正在尝试将变量作为环境变量访问，如 https://learn.microsoft.com/en-us/azure/app-service/configure-language-nodejs?pivots=platform-linux 中所述。 但没有运气。该变量只是未定义。我尝试在下一个js中从客户端和服务器端访问(据我所知，应该只在服务器端可用)。

我有一个暂存和生产部署槽，需要更改要使用的后端，并且我想通过将暂存交换到生产来在它们之间进行切换。据我所知，交换时发生的变化之一是应用程序设置。我已检查我尝试访问的变量是否已在 kudu 中设置。

重复这个问题:如何在下一个 js 应用程序中访问 appsettings 变量？

最佳 龙龙

PS。我犯了一个错误，而且是docker的部署流程出错了。现在我可以从 nextjs 的服务器端获取应用程序设置

Answer 1

托马斯的评论是正确的。

You can't access app settings from front end. front end runs in browser not on the server side

相关帖子:

1. I am unable to read environment variable from azure app service configuration from my REACT app

2. Azure WebApps React: the environment variables exist but are not present when I call process.env

3. Azure app service externalize variables environment into my Angular web application

解决方法:

您可以使用restapi来访问appsettings变量，而不是使用process.env.Your_Parmas

相关帖子: Accessing Azure Application Settings with JavaScript

官方文档: Web Apps - List Application Settings