Next.JS 14 on Docker: "ECONNREFUSED" on /api call

first question on Stack Overflow to me!

I’m making an app based on NextJS 14 and .NET 6, each one on separate docker container (FE and BE)

Application alone works without issues, problem starts when I dockerize.

Back End application works, API calls from Postman respond correctly.
Struggle come with FE application.

When I visit app from browser I got this error

▲ Next.js 14.2.7
  - Local:        http://localhost:3000
  - Network:      http://0.0.0.0:3000

 ✓ Starting...
 ✓ Ready in 85ms
 ⨯ Error: undefined

Full error

Trying to call directly the api (/api/events) from browser I got this error

{
  "status": "fetch failed",
  "message": {
    "cause": {
      "errno": -111,
      "code": "ECONNREFUSED",
      "syscall": "connect",
      "address": "172.19.0.3",
      "port": 7258
    }
  }
}

package.json main packages

 "@next/env": "^14.2.6",
 "react": "^18.3.1",
 "next": "^14.1.3",
 "next-auth": "^4.24.7",

.env

NEXTAUTH_SECRET=*SecretlySecret*
NEXT_PUBLIC_BASE_PORT="3000"
NEXT_PUBLIC_BASE_URL="http://127.0.0.1:$NEXT_PUBLIC_BASE_PORT"
NEXTAUTH_URL="$NEXT_PUBLIC_BASE_URL/api/auth"
BASE_API_URL="http://127.0.0.1:7258/api"
NODE_TLS_REJECT_UNAUTHORIZED="0"

Dockerfile

FROM node:18-alpine AS base

# Install dependencies only when needed
FROM base 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

# Install dependencies based on the preferred package manager
COPY package*.json yarn.lock* pnpm-lock.yaml* ./
RUN npm ci

# Rebuild the source code only when needed
FROM base AS builder
WORKDIR /app
COPY --from=deps /app/node_modules ./node_modules
COPY . .

# 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 during the build.
ENV NEXT_TELEMETRY_DISABLED=1

RUN npm run build

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

ENV NODE_ENV=production
# Uncomment the following line in case you want to disable telemetry during runtime.
ENV NEXT_TELEMETRY_DISABLED=1

RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs

COPY --from=builder /app/public ./public

# Set the correct permission for prerender cache
RUN mkdir .next
RUN chown nextjs:nodejs .next

# Automatically leverage output traces to reduce image size
# https://nextjs.org/docs/advanced-features/output-file-tracing
COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static

USER nextjs

EXPOSE 3000

ENV PORT=3000

# server.js is created by next build from the standalone output
# https://nextjs.org/docs/pages/api-reference/next-config-js/output
ENV HOSTNAME="0.0.0.0"
CMD ["node", "server.js"]

I’ve been stuck on this for weeks now, I’ve looked at every single thread on Stack Overflow about this error and still get no solutions.

Thank u

All the test I did:

• Assigned from Docker desktop the env BASE_API_URL with http:docker-be-container-name:7258/api
• Replaced 127.0.0.1 with localhost
• Added to .net app builder all the origins
• Created a docker network and assigned fe and be to that

docker network create new-network
docker network connect new-network docker-fe-container-name
docker network connect new-network docker-be-container-name

UPDATE:
I tried docker compose

services:  
  be:
    container_name: be
    image: be
    build: ./be
    ports:
      - 7258:443 
      - 5258:80
  fe:
    container_name: fe
    image: fe
    build: ./fe
    ports:
      - 3000:3000
    environment:
      - BASE_API_URL=http://be:5258/api
      - NEXT_PUBLIC_BASE_URL=http://fe:3000
    depends_on:
      - be

same error on FE console, but different when call api from browser

{
  "status": "fetch failed",
  "message": {
    "cause": {

    }
  }
}