Files
payguard-poc/docker-compose.yml
T
John Patrick TeruelandCopilot 3f6dcab01f Fix frontend-to-backend networking in Docker
Frontend in Docker container can't reach localhost:8000 on the host.
Implemented Docker networking fix using host.docker.internal.

Changes:
  • Updated frontend/src/App.tsx to use host.docker.internal:8000 in production
    - Automatically switches between localhost:8000 (dev) and host.docker.internal:8000 (Docker)
  • Added frontend/.env.example with API configuration
  • Updated docker-compose.yml frontend environment:
    - Added VITE_API_URL=http://host.docker.internal:8000
    - Added comments explaining the networking approach
  • Enhanced DOCKER_QUICK_START.md troubleshooting section
    - Added detailed networking explanation
    - Instructions for verifying host.docker.internal works
    - Linux-specific workarounds

How it works:
  • Docker Desktop automatically maps host.docker.internal to localhost on the host machine
  • Frontend (running in Docker) uses host.docker.internal:8000
  • API & Consumer (running on host) listen on localhost:8000
  • Both reference the same service, just from different network contexts

Workflow remains:
  Terminal 1: docker compose up (infra + frontend in Docker)
  Terminal 2: uvicorn api.main:app --reload (your host machine)
  Terminal 3: cd consumer && python pipeline.py (your host machine)

Frontend automatically reaches API at http://host.docker.internal:8000
without any manual configuration needed.

Co-authored-by: Copilot <[email protected]>
2026-04-24 20:04:21 +08:00

82 lines
2.0 KiB
YAML

version: "3.8"
services:
zookeeper:
image: confluentinc/cp-zookeeper:7.5.0
environment:
ZOOKEEPER_CLIENT_PORT: 2181
ZOOKEEPER_TICK_TIME: 2000
ports:
- "2181:2181"
networks:
- payguard-network
kafka:
image: confluentinc/cp-kafka:7.5.0
depends_on:
- zookeeper
ports:
- "9092:9092"
environment:
KAFKA_BROKER_ID: 1
KAFKA_ZOOKEEPER_CONNECT: zookeeper:2181
KAFKA_ADVERTISED_LISTENERS: PLAINTEXT://kafka:29092,PLAINTEXT_HOST://localhost:9092
KAFKA_LISTENER_SECURITY_PROTOCOL_MAP: PLAINTEXT:PLAINTEXT,PLAINTEXT_HOST:PLAINTEXT
KAFKA_INTER_BROKER_LISTENER_NAME: PLAINTEXT
KAFKA_OFFSETS_TOPIC_REPLICATION_FACTOR: 1
KAFKA_AUTO_CREATE_TOPICS_ENABLE: "true"
networks:
- payguard-network
healthcheck:
test: kafka-broker-api-versions --bootstrap-server localhost:9092
interval: 10s
timeout: 5s
retries: 5
redis:
image: redis:7.2-alpine
ports:
- "6379:6379"
networks:
- payguard-network
healthcheck:
test: redis-cli ping
interval: 10s
timeout: 5s
retries: 5
volumes:
- redis_data:/data
frontend:
build:
context: ./frontend
dockerfile: Dockerfile
ports:
- "3000:3000"
networks:
- payguard-network
depends_on:
kafka:
condition: service_healthy
redis:
condition: service_healthy
healthcheck:
test: wget --quiet --tries=1 --spider http://localhost:3000 || exit 1
interval: 10s
timeout: 5s
retries: 5
environment:
- NODE_ENV=production
- VITE_API_URL=http://host.docker.internal:8000
restart: unless-stopped
# NOTE: Frontend connects to API running on host machine via host.docker.internal
# This allows docker compose up to start infrastructure + frontend,
# while API and Consumer run locally on the same machine
volumes:
redis_data:
networks:
payguard-network:
driver: bridge