SSL 인증서 발급 (feat. next.js)

하니·2025년 2월 20일

인프라

목록 보기
9/9

ACM

  • 현재 CI/CD 환경 구성 : ec2 + nginx + docker compose

AWS Certificate ManagerACM에서 인증서 발급을 받았지만, ACM에서 발급받은 인증서는 EC2에 직접 적용하기 어렵다. ACM은 인증서를 AWS 관리형 서비스ALB, CloudFront..에서만 직접 사용할 수 있도록 설계되어 있기 때문이다.
이번 프로젝트에서는 AWS 관리형 서비스를 사용하지 않기 때문에 인증서 발급 받은 것은 삭제하고, 다른 방법을 적용하기로 하였다.

ACM이 필요한 경우

  • Load Balancer 사용할 경우
  • CloudFront 사용할 경우
  • AWS의 관리형 서비스들과 함께 사용할 경우




Let's Encrypt + Cerbot

  1. EC2에 cerbot을 설치한다.
# certbot 설치에 필요한 패키지 업데이트 및 설치
sudo apt-get update
sudo apt-get install certbot
  1. cerbot으로 SSL 인증서를 발급받는다.
# nginx 잠시 중지
## nginx가 80번 포트를 사용하고 있기 때문에, cerbot을 실행하기 위해 nginx를 잠시 중지해야 한다. 실행 중인 도커 컨테이너를 중지한다.
## 현재 폴더 위치를 확인하고 docker-compose.yml이 있는 폴더로 이동한다.
pwd # 현재 위치 확인
cd app # docker-compose.yml이 있는 폴더로 이동
sudo docker-compose down

# SSL 인증서 발급 (cerbot 실행)
sudo certbot certonly --standalone -d mywareho.me
## 이메일 주소를 입력한다.

# 인증서 발급 완료되면 /etc/letsencrypt/live/mywareho.me/ 경로에 인증서 파일들이 생성됨
  1. route 53에 등록해둔 도메인mywareho.me에 필요한 레코드를 확인하자
  • A레코드가 EC2 IPnext 웹서버 IP를 가리키고 있다.
  • SSL 인증서 검증을 위한 CNAME 레코드를 확인한다.
  • 기본적인 NA, SOA 레코드
  1. HTTPS는 443 포트를 사용하기 때문에 EC2next 웹서버 보안그룹에서 443 포트를 열어준다.
  1. nginx.conf프로젝트의 nginx 설정 파일, docker-compose.yml 파일을 수정한다.
    나는 ci/cdgithub action 코드가 있기 때문에 프로젝트에서 수정하고 github action을 돌렸다.

📁 docker/nginx/default.conf
HTTPS를 설정할 때 SSL 인증서를 설정해준다.

# HTTPS 설정 
server {
    listen 443 ssl;
    listen [::]:443 ssl;
    server_name mywareho.me;

    # SSL 인증서 설정
    ssl_certificate /etc/letsencrypt/live/mywareho.me/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/mywareho.me/privkey.pem;

    location / {
        proxy_pass http://nextjs:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

# 프론트엔드용 서버 블록
# HTTP를 HTTPS로 리다이렉트
server {
    listen 80;
    listen [::]:80;
    server_name mywareho.me;
    return 301 https://$host$request_uri;
}

# server {
#     listen       80; # IPv4
#     listen       [::]:80; # IPv6
#     # server_name mywareho.me;

#     location / {
#         proxy_pass http://nextjs:3000; # docker-compose 서비스명과 일치
#         # Next.js의 WebSocket 기능 지원 설정 (+ hot reload 기능)
#         proxy_http_version 1.1;
#         proxy_set_header Upgrade $http_upgrade;
#         proxy_set_header Connection 'upgrade';
#         # 프록시 헤더 설정
#         proxy_set_header Host $host;
#         proxy_cache_bypass $http_upgrade;
#         # 성능 최적화 위한 gzip 압축
#         # gzip on;
#         # gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
#     }
# }

# 백엔드용 서버 블록

📁 docker-compose.yml
SSL 인증서 경로를 추가해줘야 한다. 일반적으로 Nginx 서비스에 볼륨을 추가한다.

version: "3"
services:
  nginx:
    image: nginx:alpine
    ports:
      - "80:80"
      - "443:443"
    volumes:
      - ./docker/nginx/default.conf:/etc/nginx/conf.d/default.conf
      - /etc/letsencrypt:/etc/letsencrypt
    depends_on:
      - nextjs
    restart: always
    networks:
      - app_network

  nextjs:
    image: ${DOCKERHUB_USERNAME}/wms-frontend:latest
    ports:
      - "3000:3000"
    env_file:
      - .env
    restart: always
    networks:
      - app_network

networks:
  app_network:
    driver: bridge
  1. 브라우저에 접속해보면 SSL이 적용된 것을 확인할 수 있다.

    ❗️ 문제 발생 시 Nginx 로그, Next.js 로그를 확인해보자

sudo docker logs 컨테이너이름
profile
Hi, I am HANI Developer(╹◡╹). .....1hani me?

0개의 댓글