본문 바로가기

Project

[간단한 퀴즈 서비스] 배포 3/3

 결론부터 이야기하면 마침내 nginx 세팅을 여러 우여곡절을 거친 끝에 끝내고 https로 배포에 성공하였다.

Intro

 https로 배포해야 했던 이유는 신뢰성 있는 통신 프로토콜로 서비스가 제공되게 하기 위한 어찌 보면 당연한 이유와

쿠키에 담은 JWT 토큰을 읽어오기 위해 https 이거나, 같은 주소로 api 요청이 오가야 했지만

처음에 EC2에 서비스를 올리기만 하고 nginx는 docker에서 띄운 설정이 제대로 동작하지 않아 http로만 서비스되었었고,

도메인도 구매하지 않았기에 api에서 서버로 자원을 요청할 같은 주소가 아니라서 브라우저(크롬)에서 쿠키를 제대로 받아오지 못하는 이슈가 있었다.

 

이런 문제를 해결하기 위해 지난 포스팅에서 도메인 구매와 aws route53을 이용해서 도메인과 서버를 연결해 두었었다.

이제 안전한 통신이 되게 위해 https 설정만 남았다.

 

SSL 인증서

 신뢰 있는 프로토콜인 https로 서비스가 되기 위해서는 SSL인증서가 필요하다.

"SSL 인증서는 클라이언트와 서버 간의 통신을 제 3자가 보증해 주는 전자화된 문서다." (생활코딩 HTTPS와 SSL인증서)

이런 인증서를 씀으로써 클라이언트는 인증서 정보가 신뢰할 수 있는지 검증할 수 있다.

 

SSL과 SSL 디지털 인증서를 이용함으로써 아래의 장점을 가질 수 있다.

  • 통신 내용이 공격자에게 노출되는 것을 막을 수 있다
  • 클라이언트가 접속하려는 서버가 신뢰할 수 있는 서버인지 판단할 수 있다.
  • 통신 내용의 악의적인 변경을 방지할 수 있다

이랬기에 쿠키 설정에서 secure 설정(https를 쓰는지 여부)이어야 같은 주소에서의 요청이 아니더라도 요청을 받을 수 있게 하였다 생각 든다. 

악의적으로 쿠키 내용을 바꾸면 로그인되지 않은 사용자가 그리고 인가받지 않은(관리자 권한이라거나) 사용자가 권한 밖의 데이터를 요청해서 가져갈 수 있으니 애초에 브라우저 차원에서 막아두었다 생각 든다.

 

nginx 세팅

 기존에는 nginx 세팅하다 잘못되어 서버에도 영향을 줄까 하여 docker로 띄운 nginx 컨테이너에서 작업을 진행하였었다.

하지만 컨테이너로 띄운 nginx 설정이 잘못되어 컨테이너가 죽어버리는 경우 다시 띄울 수 없었다. 이를 방지하기 위해 docker file도 만들어서 컨테이너로 띄울 때, 필요한 설정들을 스크립트 파일을 읽어서 세팅이 되게 할까도 생각하였지만 SSL 인증서를 발급받기 위해 직접 키보드로 입력해야 하는 것들이 있어서 스크립트로 만들어서 하기에는 부자연스러워지기 쉽다 생각했다. 또한 docker file을 이전에 만들면서 수많은 디버깅의 시간을 가져보았기에 배포를 위해 docker file까지 써야 하는가라는 생각이 들었다.

 

다른 웹 프로젝트를 같이 하던 팀원분이랑 배포 관련하여 이야기를 나누다가 그 분의 경우 개인 프로젝트에서는 EC2에 띄운 nginx로 https를 처리하셨다 하였다. 듣고 보니 docker로 nginx를 세팅하는 것에 집착할 것이 아니라 EC2에 바로 nginx를 띄워서 하는 게 낫겠다 생각 들었다. docker로 하면 좋긴 하겠지만 다른 기능들도 구현해야 하기 그리고 팀에서 유일한 백엔드 팀원으로서 더 시간을 지체할 수 없었다. 목표는 배포하여 서비스를 제공하고 빠르게 피드백을 받는 것이었기에 EC2 nginx에 직접 세팅하였다

 

SSL 인증서 발급을 유료로 할 수도 있겠지만 취준생 입장에서 나의 노동력, 컴퓨터 사용 전기요금 이외에 비용을 발생시키고 싶지 않았다.

무료로 하려면 let's encrypt에서 인증서를 발급 받을 수 있다. 단, 3개월마다 갱신해야한다.

3개월마다 갱신도 crontab에 등록해서 3개월마다 재발급 받게 할 수 있다.

 

 

EC2에서 인증서 발급을 받고 아래와 같이 SSL 인증서 위치를 nginx 설정 파일에 적어두었다.

 

http로 요청이 오더라도 https로 리다이렉트 되도록 하였다.

 

프론트도 처음에는 pm2로 서버로 띄웠었지만 우리 서비스 프론트의 경우 React를 썼기에 Next로 구현한 SSR처럼 별도 프론트 서버가 필요없어서 프론트 코드를 빌드한 파일 위치를 적었다.

 

백앤드 api 요청은 서브 도메인인 api.devsimplequiz로 요청이 되게 하였고 내부 백앤드 port인 4242를 가리키게 하였다.

 

 

 

 

이젠 인증, 인가 기능들도 잘 동작하게 되었다.

 

 

 

 

 

 

명령어 횟수와 backup 설정들로 알아보는 힘든 시간이었다.

 

 

 

참고자료

https://opentutorials.org/course/228/4894

https://www.cloudflare.com/ko-kr/learning/ssl/what-is-ssl/

https://ko.wikipedia.org/wiki/%EC%A0%84%EC%86%A1_%EA%B3%84%EC%B8%B5_%EB%B3%B4%EC%95%88