Nuxt•4mo ago

Custom, external, $fetch fetches the external API instead of the nuxt server, BUT only in production

I'm using the same setup locally and in production: * caddy, running on the host, not in a docker container * docker container for nuxt * docker container for the api (FastAPI) It works locally, but doesn't work on the VPS. Here's some of the setup: Caddyfile

{
        debug
        email [email protected]
}

app.example.com {
        reverse_proxy localhost:3000
}

{
        debug
        email [email protected]
}

app.example.com {
        reverse_proxy localhost:3000
}

docker-compose.yaml

name: example
networks:
  example:
    name: example
    driver: bridge
services:
  nuxt:
    container_name: nuxt
    ports: 
      - "3000:3000"
    build:
      dockerfile: Dockerfile.prod
      context: ../nuxt
    image: example/nuxt
    env_file:
      - ../nuxt/.env
    depends_on:
      - api
    networks:
      - example
    environment:
      - NUXT_PUBLIC_API_BASE_URL=http://api:8001/api
  api:
    container_name: api
    build:
      context: ../fastapi
    image: example/api
    networks:
      - example
    ports: 
    - "8001:8001"

name: example
networks:
  example:
    name: example
    driver: bridge
services:
  nuxt:
    container_name: nuxt
    ports: 
      - "3000:3000"
    build:
      dockerfile: Dockerfile.prod
      context: ../nuxt
    image: example/nuxt
    env_file:
      - ../nuxt/.env
    depends_on:
      - api
    networks:
      - example
    environment:
      - NUXT_PUBLIC_API_BASE_URL=http://api:8001/api
  api:
    container_name: api
    build:
      context: ../fastapi
    image: example/api
    networks:
      - example
    ports: 
    - "8001:8001"

nuxt/Dockerfile.prod

FROM node:latest AS build
COPY . /app
WORKDIR /app
RUN npm install
RUN npm run build

FROM build AS base
WORKDIR /app
COPY --from=build /app/.output /app
EXPOSE 3000
CMD ["node", "./server/index.mjs"]

FROM node:latest AS build
COPY . /app
WORKDIR /app
RUN npm install
RUN npm run build

FROM build AS base
WORKDIR /app
COPY --from=build /app/.output /app
EXPOSE 3000
CMD ["node", "./server/index.mjs"]

api.Dockerfile

FROM python:3.10

WORKDIR /app

COPY requirements.txt .

RUN pip install -r requirements.txt

COPY . /app

EXPOSE 8001

CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8001"]

FROM python:3.10

WORKDIR /app

COPY requirements.txt .

RUN pip install -r requirements.txt

COPY . /app

EXPOSE 8001

CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8001"]

nuxt/.env

APP_NAME=""
NITRO_PORT="3000"
SUPABASE_CONFIG="mock"
NUXT_PUBLIC_API_BASE_URL="http://api:8001/api"
COMPATIBILITY_DATE=2024-08-16

APP_NAME=""
NITRO_PORT="3000"
SUPABASE_CONFIG="mock"
NUXT_PUBLIC_API_BASE_URL="http://api:8001/api"
COMPATIBILITY_DATE=2024-08-16

api/.env

SUPABASE_CONFIG=mock

SUPABASE_CONFIG=mock

0 Replies

No replies yetBe the first to reply to this messageJoin

Gaming

Programming

Custom, external, $fetch fetches the external API instead of the nuxt server, BUT only in production