한컴AI 2기

[스나이퍼팩토리] 한컴AI 2기 - Vercel - FastAPI Mixed Content 트러블 슈팅 (무료 도메인, Nginx https, 서트봇)

싱커 2025. 12. 4. 10:09

이번 글은 내가 진행했던 RAG 프로젝트 환경 세팅 중,
무료 도메인 확보 → 서버 연결 → HTTPS 적용 → Nginx 리팩토링 전 과정을 정리한 기록이다.

AWS EC2에서 FastAPI 백엔드를 운영하고 있었는데,
Vercel 프론트엔드에서 API 요청을 보내려면 반드시 HTTPS가 필요했다.
하지만 초기 상태는 HTTP IP 기반 서버뿐이라
브라우저에서 "Mixed Content" 에러가 터졌다.

그래서 결국 무료 도메인 확보 → Nginx HTTPS 구성 → Certbot 발급을 직접 해보기로 했다.


1. 무료 도메인 확보 — alain.r-e.kr

프로덕션용이 아니라 연구 프로젝트였기 때문에, 우선 HTTPS를 빠르게 적용하는 것이 목표였다.

무료 도메인을 제공하는 내도메인.한국 사이트에서 alain.r-e.kr을 선택했다.

내도메인.한국의 도메인 설정

DNS A레코드에 EC2 퍼블릭 IP(v4)만 등록하면 끝. DNS 전파는 보통 1~5분 내로 완료되었다.


2. 기존 문제 상황 — Certbot이 실패했다

처음 Certbot을 실행했을 때 다음과 같은 오류가 발생했다:

Error while running nginx -t:
cannot load certificate "/etc/letsencrypt/live/alain.r-e.kr/fullchain.pem"

원인은 매우 명확했다.

Nginx 설정에 이미 HTTPS server block이 존재하고 있었고,
아직 발급되지 않은 인증서를 로딩하려다가 nginx test가 실패한 것이다.

그래서 전략을 바꿨다:

1) 발급 전 → HTTP-only 구성 → Certbot 성공
2) 발급 후 → HTTPS 블록 다시 적용 → Nginx Reload

3. Nginx 설정 — HTTP 전용 버전으로 리팩토링

Certbot이 인증서를 발급하려면, Nginx 설정에 HTTPS 블록이 존재하면 안 된다.
그래서 HTTPS 관련 내용을 모두 제거한 “HTTP-only 구성”으로 바꿨다.

server {
  listen 80;
  server_name alain.r-e.kr;

  location /.well-known/acme-challenge/ {
    root /var/www/certbot;
  }

  location / {
    proxy_pass http://localhost:8000;
  }
}

4. Certbot 설치 & 인증서 발급

설치 명령어는 다음과 같다:

sudo apt install certbot python3-certbot-nginx -y

인증서 발급:

sudo certbot --nginx -d alain.r-e.kr --agree-tos --email my@email.com

아래 문구가 뜨면 성공이다:

Congratulations! Your certificate has been successfully issued!

5. HTTPS 서버블록 추가 — 본격 안전 API 구축

인증서 발급 후 HTTPS server block을 다시 추가하고, nginx -t → reload 를 수행했다.

sudo nginx -t
sudo systemctl reload nginx

이제 아래 URL에서 Swagger가 HTTPS로 열린다.

https://alain.r-e.kr/docs

swagger docs

6. Mixed Content 문제 해결

HTTPS API가 준비되면서, Vercel에서 발생하던 Mixed Content 오류가 모두 사라졌다.

proxy_set_header X-Forwarded-Proto https;
→ Mixed Content 방지의 핵심 설정

7. 마무리하며 — 배운 점

이번 도메인/HTTPS 구축 과정에서 배운 핵심은 다음과 같다.

① Certbot은 “HTTPS 블록이 없는 상태”에서 실행해야 한다.
→ 인증서 파일이 없는데 HTTPS server block이 미리 있으면 nginx test가 죽는다.

② 도메인은 HTTPS 구축의 필수 요소다.
→ IP만으로는 무료/정식 인증서 발급 불가능.

③ Nginx는 HTTP → HTTPS 단계적 관리가 중요하다.
→ 특히 SSE, CORS가 필요할 때는 더 세심한 설정 필요.

📌 정리

1 무료 도메인 선택 (alain.r-e.kr)
2 DNS A레코드 → EC2 IP 매핑
3 Nginx HTTP-only 구성
4 Certbot으로 SSL 발급
5 HTTPS 서버블록 최종 적용

🏁 마치며

이 기록이, 나처럼 “무료 도메인 + EC2 + FastAPI + Nginx + Certbot” 조합으로 HTTPS를 적용하려는 사람에게 도움이 되길 바란다.

 

Cloudflare SSL Mode는 본 글에서 다루지 않았지만 필요하다면 후속 포스팅으로 정리해볼 수도 있다.


본 후기는 [한글과컴퓨터x한국생산성본부x스나이퍼팩토리] 한컴 AI 아카데미 2기 (B-log) 리뷰로 작성 되었습니다.