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>
38 lines
1.6 KiB
Docker
38 lines
1.6 KiB
Docker
FROM node:20-alpine AS build-stage
|
|
WORKDIR /app
|
|
|
|
# 호스트의 npm 11 이 작성한 package-lock.json 형식과 호환되도록 npm 을 11 로 업그레이드
|
|
# (전역 설치는 root 권한이 필요하므로 USER 전환 전에 수행)
|
|
RUN npm install -g npm@11
|
|
|
|
# 개발 환경(docker-compose.dev.yml)은 이 스테이지에서 vite dev 서버를 구동하므로 비-root 로 전환한다.
|
|
# /app 소유권을 넘겨야 익명 볼륨(node_modules)이 node 소유로 생성되어 vite 캐시(.vite) 쓰기가 가능하다.
|
|
RUN chown node:node /app
|
|
USER node
|
|
|
|
COPY --chown=node:node package*.json ./
|
|
RUN npm ci
|
|
|
|
COPY --chown=node:node . .
|
|
|
|
ARG BUILD_MODE=production
|
|
# 브라우저가 호출할 API 경로 — 기본은 같은 도메인의 /api (리버스 프록시가 백엔드로 넘긴다).
|
|
# compose 가 루트 BACKEND_API_URL 을 넘긴다. API 를 별도 도메인에 둘 때만 절대 URL 이 들어온다.
|
|
ARG VITE_API_BASE_URL=/api
|
|
ENV VITE_API_BASE_URL=$VITE_API_BASE_URL
|
|
|
|
RUN npm run build-only -- --mode ${BUILD_MODE}
|
|
|
|
# 비-root 전용 nginx 이미지 (보안 규칙: 컨테이너 root 실행 금지)
|
|
# 1024 미만 포트는 바인드할 수 없으므로 8080 을 사용한다 — nginx.conf 의 listen 과 일치해야 한다.
|
|
FROM nginxinc/nginx-unprivileged:stable-alpine AS production-stage
|
|
|
|
# 보안 헤더 포함된 nginx 설정 적용
|
|
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
|
COPY --from=build-stage /app/dist /usr/share/nginx/html
|
|
|
|
# 이미지 기본 사용자(nginx, uid 101)로 구동 — root 로 되돌리지 말 것
|
|
USER nginx
|
|
|
|
EXPOSE 8080
|
|
CMD ["nginx", "-g", "daemon off;"] |