尝试访问本地 API 端点时，React/Next.js docker 构建失败

Question

我似乎无法获取我的node:alpine Docker 镜像来构建react/next.js。

我可以让它在本地正常构建，但当 Docker 构建到达 API 端点时，我从未在 API 日志中看到流量，该端点本身在 Docker 容器（nginx、headless craft cms 等）中运行。

正如我所尝试的那样，构建似乎根本不喜欢本地主机：

http://localhost:9000/api

...这是我在日志中收到的消息：

#15 13.76 > Build error occurred
#15 13.76 FetchError: request to http://localhost:9000/api failed, reason: connect ECONNREFUSED 127.0.0.1:9000

我听说我可以使用主机名代替“localhost”，因此在我的 MacOS 终端中，我输入了“主机名”，并将 localhost 替换为该值。这不会完全出错，但构建会挂在构建的“生成页面...”步骤上。

如何让 Docker 构建识别本地主机，或者换句话说，如何将 API URL 设置为本地 Docker 容器托管的端点？

这是我的 Dockerfile：

# Install dependencies only when needed
FROM node:alpine AS deps
RUN apk add --no-cache libc6-compat
WORKDIR /app
COPY package.json yarn.lock ./
RUN yarn --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 static

# Production image, copy all the files and run next
FROM node:alpine AS runner
WORKDIR /app

ENV NODE_ENV production

RUN addgroup -g 1001 -S nodejs
RUN adduser -S nextjs -u 1001

# You only need to copy next.config.js if you are NOT using the default configuration
COPY --from=builder /app/public ./public
COPY --from=builder --chown=nextjs:nodejs /app/.next ./.next
COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/package.json ./package.json

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.
# ENV NEXT_TELEMETRY_DISABLED 1

CMD ["yarn", "start"]

Answer 1

好吧，我找到了解决方案，或者说是解决方案。

经过一番研究，我发现我需要连接到“桥接网络”。

我通过首先输入“docker network ls”找到了桥接网络 IP：

这给了我获取 IP 所需的网络名称，我通过输入“docker network inform craftcms_default”来完成此操作：

在我的例子中，输出相当多，但我唯一需要的是“网关”IP，这里是 172.19.0.1

我的 nginx 服务器映射为 9000:80，因此 headless Craft CMS API 位于：

http://172.19.0.1:9000/api

...但是，作为快速健全性检查，我将其输入到浏览器中，结果是一个不断旋转/加载的页面。但我并没有被吓倒，我将其作为 PUBLIC_NEXT_API_URL 输入到 env.local 中，静态站点生成在 Docker 构建期间顺利完成。

我仍在尝试一种优雅的方式来在 Docker 构建中设置此环境变量，因此如果有人有任何建议，我很乐意听到！

这是一个有趣的挑战，因为我无法找到任何专门针对由于 Docker 构建无法获取另一个本地运行容器中托管的 URL 而运行的进程的答案/Google 结果。希望这可以帮助其他遇到此问题的人！

Answer 2

感谢您的帖子 - 它帮助我找到了一个可以解决问题的解决方案。我发现定义桥接网络网关是一个更优雅的解决方案；它允许您定义 PUBLIC_NEXT_API_URL 并且永远不会更改它。

以下是在 docker-compose 文件中执行此操作的方法：

services:
  db:
    image: postgres
    restart: always
    networks:
      - stagingnetwork

  api:
    image: express
    restart: always
    ports:
      - '3008:3008'
    depends_on:
      - db
    networks:
      - stagingnetwork


  adminer:
    image: adminer
    restart: always
    networks:
      - stagingnetwork
    ports:
      - 8080:8080

networks:
  stagingnetwork:
    driver: bridge
    ipam:
      config:
        - subnet: 172.28.0.0/16
          gateway: 172.28.0.1

现在，您可以设置PUBLIC_NEXT_API_URL to http://172.28.0.1:3008/api,并确信这将是每次启动 docker-compose 时的端点。

另请注意，您可能需要删除现有网络才能"docker-compose up --force-recreate"获得正确的 IP。