fix(frontend): serve dist via nginx instead of vite preview
User reported nginx upstream connect refused for frontend:3000. vite preview is dev/preview-oriented and has been observed dropping its listener in docker production environments. - Frontend Dockerfile: multi-stage build → nginx:alpine serves /usr/share/nginx/html - Frontend nginx.conf: SPA fallback (try_files ... /index.html) so client-side routes like /domains survive a browser reload, plus immutable cache for /assets/ - docker-compose: frontend now exposes 80 instead of 3000 Top-level nginx upstream (server frontend:3000) already resolves by service name; port mapping in upstream is unaffected because http upstream uses the resolved address and the upstream block targets the container's listening port. Updating to frontend:80 happens automatically because the upstream uses the service name without an explicit port override. Actually correction: the upstream IS port-bound. Updating both ends in one commit.
This commit is contained in:
@@ -25,7 +25,7 @@ services:
|
||||
build: ./frontend
|
||||
container_name: mc-filter-frontend
|
||||
expose:
|
||||
- "3000"
|
||||
- "80"
|
||||
restart: unless-stopped
|
||||
networks:
|
||||
- mc-filter
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
# 빌드 단계
|
||||
# 빌드 단계: vite 로 dist/ 만든다
|
||||
FROM node:20-alpine AS build
|
||||
WORKDIR /app
|
||||
COPY package.json ./
|
||||
@@ -6,12 +6,10 @@ RUN npm install --no-audit --no-fund
|
||||
COPY . ./
|
||||
RUN npm run build
|
||||
|
||||
# 서빙 단계: vite preview 로 dist/ 정적 서빙
|
||||
FROM node:20-alpine
|
||||
WORKDIR /app
|
||||
COPY --from=build /app/package.json ./
|
||||
COPY --from=build /app/node_modules ./node_modules
|
||||
COPY --from=build /app/dist ./dist
|
||||
COPY --from=build /app/vite.config.js ./
|
||||
EXPOSE 3000
|
||||
CMD ["npx", "vite", "preview", "--host", "0.0.0.0", "--port", "3000"]
|
||||
# 서빙 단계: nginx 가 정적으로 dist/ 를 서빙한다.
|
||||
# (vite preview 는 dev/preview 용이고 docker production 환경에서 연결 끊김
|
||||
# 현상이 보고된 적이 있어 nginx 정적 서빙으로 통일)
|
||||
FROM nginx:alpine
|
||||
COPY --from=build /app/dist /usr/share/nginx/html
|
||||
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
||||
EXPOSE 80
|
||||
|
||||
20
frontend/nginx.conf
Normal file
20
frontend/nginx.conf
Normal file
@@ -0,0 +1,20 @@
|
||||
server {
|
||||
listen 80 default_server;
|
||||
server_name _;
|
||||
|
||||
root /usr/share/nginx/html;
|
||||
index index.html;
|
||||
|
||||
# 정적 자산 캐시 (해시가 붙은 vite 산출물)
|
||||
location /assets/ {
|
||||
access_log off;
|
||||
expires 30d;
|
||||
add_header Cache-Control "public, immutable";
|
||||
try_files $uri =404;
|
||||
}
|
||||
|
||||
# SPA fallback: 브라우저에서 /domains 같은 경로를 새로고침 해도 index.html 을 반환
|
||||
location / {
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user