[Docker] 8-2.Docker 실무: 3 Tier 아키텍처 구성

3 Tier 아키텍처 구성

• 기존 : 백엔드 외부 노출로 위험

• 프록시 기술 설정

# api.js 파일

import axios from 'axios';

const api = axios.create({
    // baseURL: process.env.VUE_APP_API_BASE_URL || 'http://localhost:8080'
});

export default api;

# nginx.conf 파일

server {
    listen 80;
    server_name _;

    location / {
        root /usr/share/nginx/html;
        index index.html index.htm;
    }

    location /api/ {
        proxy_pass http://leafy:8080;
    }

    error_page 500 502 503 504 /50x.html;
    location = /50x.html {
        root /ust/share/nginx/html;
    }
}

# 프록시 설정 추가한 도커 파일

# 빌드 이미지로 node:14 지정
FROM node:14 AS build

WORKDIR /app

# 라이브러리 설치에 필요한 파일만 복사
COPY package.json .
COPY package-lock.json .

# 외부 라이브러리 설치
RUN npm ci

# 소스코드 복사
COPY . /app

# 소스코드 빌드
RUN npm run build

FROM nginx:1.21.4-alpine

# -- 추가 프록시 설정 실습
# 소스코드의 nginx.conf 파일을 이미지 빌드 시 nginx 설정으로 복사
COPY nginx.conf /etc/nginx/conf.d/default.conf

COPY --from=build /app/dist /usr/share/nginx/html

EXPOSE 80
ENTRYPOINT [ "nginx" ]
CMD [ "-g", "daemon off;" ]