블루-그린(Blue/Green) 배포 머리 박치기

블루-그린 배포란 무엇인가?

블루-그린 배포: 애플리케이션이나 서비스를 배포할 때 다운타임을 최소화하고, 배포 과정에서 발생할 수 있는 문제를 빠르게 복구할 수 있도록 설계된 배포 전략.

• 기존 시스템(블루 환경)과 새로운 시스템(그린 환경)을 동시에 운영하며, 안정적이고 빠른 배포를 가능하게 한다.

---

블루-그린 배포의 원리

1. 두 개의 환경(Blue와 Green) 운영
   • Blue 환경: 현재 운영 중인 환경
   • Green 환경: 새로운 버전의 애플리케이션을 배포하고 테스트하는 환경
2. 그린 환경으로 트래픽 전환
   새 버전이 Green 환경에 배포되면, 트래픽을 기존 Blue 환경에서 Green 환경으로 전환합니다. 이 과정은 주로 로드밸런서나 DNS 변경을 통해 수행됩니다.
3. 롤백 가능성 보장
   만약 Green 환경에서 문제가 발생하면, 트래픽을 다시 Blue 환경으로 전환하여 빠르게 복구할 수 있다.

---

블루-그린 배포 실습

현재 서버 상태

- 3000포트: 프론트엔드 서버

- 8000포트: 백엔드 서버

#/etc/nginx/sites-enabled/default                                                                                    
server {
    listen 80 default_server;
    listen [::]:80 default_server;

    server_name _;
    location / {
        proxy_pass http://127.0.0.1:3000;# 프론트 서버
    }
a
# 백엔드 서버로 요청 전달
    location /api/ {
        proxy_pass http://127.0.0.1:8000/;# 백엔드 서버
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

 

목표 

1. 프론트와 백엔드 모두 블루-그린 배포를 진행

2. 3000번 포트와 3001 포트에 프론트엔드의 블루-그린 환경 생성

3. 8000번 포트와 8001 포트에 백엔드의 블루-그린 환경 생성

4. 쉘스크립트를 통해 블루 그린 스위치 자동화 구현

 

3001번 포트에 서버를 하나 더 만들기 위해 git clone을 한번 더 진행함

디랙토리 상태

 

blue는 3000포트를 사용하도록, green은 3001포트를 사용하도록 지정 (백엔드는 8000/8001)

위 프로젝트는 express를 활용한 커뮤니티 프로젝트라 아래와 같이 설정해줌

app.js (프론트 그린서버)

nginx 설정 파일을 아래와 같이 수정

 

# Blue 환경 정의
upstream frontend-blue {
    server 127.0.0.1:3000;
}

# Green 환경 정의
upstream frontend-green {
    server 127.0.0.1:3001;
}

upstream backend-blue {
    server 127.0.0.1:8000;
}

upstream backend-green {
    server 127.0.0.1:8001;
}

server {
    listen 80;

    # 현재 활성화된 환경 설정 (blue 또는 green)
    set $active_frontend frontend-blue;
    set $active_backend backend-blue;

    # 프론트엔드 요청 처리
    location / {
        proxy_pass http://$active_frontend;
    }

    # 백엔드 요청 처리
    location /api/ {
        rewrite ^/api(/.*)$ $1 break; # "/api"를 제거하고 나머지 경로만 전달
        proxy_pass http://$active_backend;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

 

쉘스크립트로 블루서버에서 그린서버로 바꾸도록 하는 작업을 자동화 한다.

1. 그린 서버를 킨다

2. nginx로 그린 서버를 가리키게 한다.

3. nginx를 리로드하여 설정을 적용한다.

4. 블루 서버를 끈다.

위 과정이면 바뀔거 같아 쉘 스크립트를 작성함

#!/bin/bash

# Nginx 설정 파일
NGINX_CONFIG="/etc/nginx/sites-enabled/default"
APP_DIR="/home/ubuntu"  # 앱 디렉토리

# 현재 활성화된 환경 확인
CURRENT_FRONTEND=$(sed -n 's/^.*set \$active_frontend \([^;]*\);.*$/\1/p' $NGINX_CONFIG)

if [ "$CURRENT_FRONTEND" == "frontend-blue" ]; then
    NEW_FRONTEND="frontend-green"
else
    NEW_FRONTEND="frontend-blue"
fi

echo "현재 활성 프론트엔드 서버: $CURRENT_FRONTEND"
echo "전환할 프론트엔드 서버: $NEW_FRONTEND"

# 새 프론트엔드 서버 시작
echo "새 프론트엔드 서버 실행 중..."
pm2 start ${APP_DIR}/${NEW_FRONTEND}/app.js --name "${NEW_FRONTEND}"

# Nginx 설정 변경
echo "Nginx 설정 변경 중..."
if [ -f "${NGINX_CONFIG}.bak" ]; then
    rm ${NGINX_CONFIG}.bak
fi

sed -i "s/set \$active_frontend $CURRENT_FRONTEND;/set \$active_frontend $NEW_FRONTEND;/g" $NGINX_CONFIG

# Nginx 리로드
systemctl reload nginx
echo "Nginx 설정 변경 완료!"

# 기존 프론트엔드 서버 종료
echo "기존 프론트엔드 서버 종료 중..."
pm2 stop "${CURRENT_FRONTEND}"
pm2 delete "${CURRENT_FRONTEND}"
echo "기존 프론트엔드 서버 종료 완료!"

echo "프론트엔드 배포 성공!"

현재 아래와 같은 상황

위에 작성한 쉘 스크립트 실행 시 

 

됐당

 

근데 이제 롤백 가능성 보장 기능도 넣어야 한다..