NuxtN
Nuxt•16mo ago
jd

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 info@example.com
}

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"


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"]


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"]


nuxt/.env
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
Was this page helpful?