【问题标题】:React/Next.js docker build failing when trying to reach out to local API endpoint尝试访问本地 API 端点时,React/Next.js docker build 失败
【发布时间】:2021-07-23 09:09:03
【问题描述】:

我似乎无法获取我的 node:alpine Docker 映像,以便构建 react/next.js。

我可以让它在本地构建良好,但是当 Docker 构建到达 API 端点时,我从未在我的 API 日志中看到流量,该端点本身在 Docker 容器(nginx、headless craft cms 等)中运行。 )。

构建似乎根本不喜欢 localhost,因为我已经尝试过:

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 构建识别 localhost,或者换句话说,如何将我的 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"]

【问题讨论】:

    标签: node.js reactjs docker next.js alpine


    【解决方案1】:

    我知道这是一个老问题,但我会将我的解决方案留给任何新的人。尽管给定的解决方案确实对我有用,但我四处寻找更优雅的东西。这个问题显然是因为localhost 主机名总是指当前容器的本地主机,而不是你的主机。

    他们指的是使用host.docker.internal 从容器连接到另一个服务的 docker for mac 文档。使用许多其他答案中推荐的容器名称对我没有帮助,但使用 host.docker.internal 解决了这个问题。

    文档:

    https://docs.docker.com/docker-for-mac/networking/

    参考:

    https://forums.docker.com/t/localhost-and-docker-compose-networking-issue/23100/5

    【讨论】:

      【解决方案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。

      【讨论】:

      • 很高兴知道!感谢您发布此信息!
      【解决方案3】:

      好的,我想出了解决方案,或者一个解决方案。

      挖了一圈,发现需要连接“桥接网络”。

      我通过首先输入“docker network ls”发现了桥接网络 IP 是什么:

      这给了我获取 IP 所需的网络名称,我通过键入“docker network inspect 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 构建中设置这个 env var,所以如果有人有任何建议,我很想听听!

      考虑到由于 Docker 构建无法获取托管在另一个本地运行的容器中的 URL,我无法找到任何答案/Google 结果专门用于运行的进程,这是一个有趣的挑战。希望这可以帮助其他在这个问题上苦苦挣扎的人!

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2018-01-20
        • 1970-01-01
        • 2020-12-31
        • 1970-01-01
        • 2012-11-07
        • 2011-07-08
        • 2021-03-06
        • 2015-08-19
        相关资源
        最近更新 更多