ttipo
6dcbb45eb9
브라우저가 프론트와 API 를 서로 다른 도메인으로 호출하던 구조를 같은 도메인의 /api 경로로 통합한다. 운영은 Nginx Proxy Manager 의 Proxy Host(/ → frontend:8080)와 Custom location(/api → backend:3000)이, 개발은 vite dev 프록시가 같은 규칙으로 백엔드에 넘긴다. - 같은 출처 호출이라 CORS 설정이 필요 없고 CSP connect-src 'self' 가 그대로 동작한다 (기존 예시대로 별도 도메인에 배포하면 CSP 에 막혀 API 호출이 실패했다) - 프론트 번들의 baseURL 이 /api 상대경로라 도메인이 바뀌어도 다시 빌드할 필요가 없다 - NPM 설정 절차와 주의점(Cache Assets 끄기, proxy 네트워크 생성)을 README "운영 배포"에 정리했다 - 프록시 설정이 빠지면 frontend nginx 가 /api 를 404 로 막는다 — index.html(200)로 조용히 실패하지 않게 함께 고친 CORS 문제: - CORS_ORIGIN 에 콤마로 여러 오리진을 적으면 문자열 전체를 하나로 비교해 모두 막히던 버그 - 운영에서도 localhost:5173·localhost:3000 이 credentials 포함으로 항상 허용되던 문제 - 형식이 잘못된 오리진(경로 포함 등)은 기동 시점에 실패하도록 검증 추가 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
89 lines
3.5 KiB
Bash
89 lines
3.5 KiB
Bash
# ==========================================
|
|
# 프로젝트 전역 설정
|
|
# ==========================================
|
|
PROJECT_NAME=project
|
|
APP_ENV=development
|
|
BUILD_MODE=development
|
|
FRONTEND_DIR=frontend
|
|
BACKEND_DIR=backend
|
|
|
|
# ==========================================
|
|
# 포트 설정
|
|
#
|
|
# 컨테이너 포트 매핑뿐 아니라 **호스트에서 띄우는 vite dev 서버**도 이 값을 따른다.
|
|
# (frontend/vite.config.ts 가 이 파일을 직접 읽는다 — FRONTEND_PORT 로 열고
|
|
# /api 프록시는 BACKEND_PORT 로 보낸다)
|
|
# ==========================================
|
|
FRONTEND_PORT=5173
|
|
BACKEND_PORT=3000
|
|
WEBSOCKET_PORT=3001
|
|
DB_PORT=5432
|
|
REDIS_PORT=6379
|
|
|
|
# ==========================================
|
|
# Database 설정
|
|
# ==========================================
|
|
DB_IMAGE=postgres:15-alpine
|
|
DB_USER=app_user
|
|
DB_PASSWORD=change-me-in-local-env
|
|
DB_NAME=project_db
|
|
DB_DATA_DIR=./data/postgres
|
|
|
|
# ==========================================
|
|
# Redis 설정
|
|
# ==========================================
|
|
REDIS_IMAGE=redis:7-alpine
|
|
REDIS_PASSWORD=change-me-in-local-env
|
|
REDIS_DATA_DIR=./data/redis
|
|
|
|
# ==========================================
|
|
# API 경로 · CORS — 프론트와 API 는 같은 도메인을 쓴다
|
|
#
|
|
# 브라우저는 /api 상대경로로만 호출하고, 개발에서는 vite dev 프록시가
|
|
# 운영에서는 Nginx Proxy Manager 가 백엔드로 넘긴다 (운영과 같은 구조).
|
|
#
|
|
# BACKEND_API_URL : 프론트 번들에 박히는 API 경로 (compose 로 프론트 컨테이너를 빌드할 때 쓰인다)
|
|
# CORS_ORIGIN : 다른 오리진에서 API 를 호출할 때만 작성 (scheme://host[:port], 콤마 구분)
|
|
# 같은 출처 요청에는 CORS 가 적용되지 않으므로 기본은 비워 둔다.
|
|
# ==========================================
|
|
BACKEND_API_URL=/api
|
|
CORS_ORIGIN=
|
|
|
|
# ==========================================
|
|
# Rate Limiting (API 남용 방지)
|
|
# 미설정 시 백엔드 기본값(60초 / 100회) 사용
|
|
# ==========================================
|
|
THROTTLE_TTL_MS=60000
|
|
THROTTLE_LIMIT=100
|
|
|
|
# ==========================================
|
|
# DB 스키마 동기화 (개발 전용, 기본 false)
|
|
# true 로 켜면 엔티티 변경이 DB 에 자동 반영되어 빠르게 실험할 수 있지만,
|
|
# 그 상태에서는 migration:generate 가 "변경 없음"만 내놓는다.
|
|
# 운영으로 갈 코드라면 꺼둔 채 마이그레이션으로 관리할 것.
|
|
# (운영 환경에서는 이 값과 무관하게 항상 비활성화된다)
|
|
# ==========================================
|
|
DB_SYNCHRONIZE=false
|
|
|
|
# ==========================================
|
|
# 선택적 서비스 (Compose profiles)
|
|
#
|
|
# 기본값(비어 있음) = redis 와 frontend 컨테이너를 기동하지 않는다.
|
|
#
|
|
# redis 캐시·세션 공유가 필요해질 때 → COMPOSE_PROFILES=redis
|
|
# frontend vite 를 컨테이너로 띄워야 할 때 → COMPOSE_PROFILES=frontend
|
|
# 둘 다 → COMPOSE_PROFILES=redis,frontend
|
|
#
|
|
# 일회성으로 켜려면: docker compose --profile redis ... up -d
|
|
#
|
|
# ⚠️ 개발 환경의 프론트엔드는 호스트에서 띄우는 것이 기본이다 (`cd frontend && npm run dev`).
|
|
# 컨테이너 vite 는 바인드 마운트 때문에 첫 서빙까지 수 분이 걸린다.
|
|
# ==========================================
|
|
COMPOSE_PROFILES=
|
|
|
|
# ==========================================
|
|
# 파일 업로드 (로컬 디스크)
|
|
# ==========================================
|
|
UPLOAD_DATA_DIR=./data/uploads
|
|
UPLOAD_MAX_SIZE_MB=5
|