AWS 배포하기 - Spring Boot, Vue

AWS에 서비스를 배포하는 방법을 간단하게 정리해보겠습니다.
배포를 처음 경험해서 잊지 않기 위해 개념적으로 정리한 글이라, 보다 자세한 내용이 궁금하신 분들은 아래 글을 참고하시면 되겠습니다.

• https://choppadontbiteme.tistory.com/98

0. 준비

API 서버와 프론트엔드 서버를 분리하여 배포하고자 했습니다.
API 서버로는 스프링 부트, 프론트 엔드 서버로는 Vue를 사용했습니다.
API 서버와 프론트 서버를 분리하는 것에도 여러 방법이 있었는데, 하나의 EC2 인스턴스 내에서 포트만을 분리하는 방법을 이용했습니다. 추가로 NginX의 리버스 프록시를 통해 요청에 따라 적절한 서버로 연결해주었습니다.

• '/' 연결 -> 프론트 서버
• '/api' 로 연결 -> API 서버

또한 배포 방식에도 여러 방식이 있겠지만, 수동으로 배포하는 방식을 이용하였습니다.

1. AWS EC2 인스턴스 생성

먼저 AWS에 EC2 인스턴스를 생성하여 서버를 확보합니다.

EC2 인스턴스 생성에 대해서는 잘 정리된 글이 많아 참고하며 진행했습니다.
특이사항은 다음과 같습니다.

• Ubuntu 18 OS를 선택
• 이후 SSH 접속 시 MobaXterm을 이용할 것이기 때문에 확장자가 .ppk인 키 페어를 발급
• SSH(22), HTTP(80), HTTPS(443), API 서버(3000), 프론트 서버(8080) 포트 오픈

2. .jar 를 EC2 서버로

배포를 원하는 프로젝트를 빌드한 후, .jar 파일만 EC2 서버로 업로드해주면 됩니다.
업로드 시 저는 MobaXterm을 이용했습니다.

주의할 점은 2가지 정도됩니다.

(1) EC2에 JDK 설치
당연하지만 아직 서버에는 JDK가 없는 상황이므로, 프로젝트 버전에 맞는 JDK를 설치해주어야 .jar 파일을 실행하고 서버를 돌릴 수 있습니다.

(2) 빌드 방식 - bootJar
항상 그런 것인지는 모르겠지만 저 같은 경우 빌드 명령어를 통해서 빌드한 경우 ~-plain-~.jar 와 같이 'plain'이 붙은 jar 파일이 생성되었습니다.
이 파일을 서버에서 실행하려하면 main을 찾을 수 없다는 에러가 발생합니다.

Gradle을 통해 build-bootJar 를 더블 클릭하여 빌드하면, plain이 붙은 jar 와 붙지 않은 jar가 하나씩 생성될 것입니다.
이때 plain이 붙지않는 파일을 이용하면 됩니다.

백엔드 서버가 성공적으로 실행됐다면, postman 등을 통해 'EC2 인스턴스의 퍼블릭 IPv4 주소: 3000' 으로 요청하면 작성한 api에 따라 적절한 response가 올 것입니다.

3. Vue 프로젝트를 EC2 서버로

스프링 부트는 실행가능한 Jar 파일을 생성해줘서 편리했지만, Vue 프로젝트는 통째로 EC2 서버로 옮겨줘야 합니다.
그런데 SSH, MobaXterm을 이용해 업로드하면 그 속도가 매우 느립니다. 따라서 다른 방법을 이용해야 합니다.
저 같은 경우는 정말 간단하게 배포만 경험한 것이라, Vue 프로젝트 자체를 서버에서 개발 완성했습니다. 우선은 이렇게 했지만, 아무래도 github에 올리고 clone해 오는 방법이 가장 좋을 것 같습니다.

마찬가지로 프론트 서버를 실행 후 'EC2 인스턴스의 퍼블릭 IPv4 주소: 8080' 으로 접속하면 개발한 페이지를 확인할 수 있을 것입니다.

당연히 이때도 서버에 node, npm, vue를 설치해줘야 합니다.
그런데 node 버전에 따라서 Ubuntu 18과 호환되지 않는 경우가 있습니다. 따라서 적절한 버전을 설치해줘야 되는데, 저는 nvm을 통한 설치를 이용했습니다.

4. NginX 리버스 프록시

NginX를 설치합니다.
sudo apt install nginx

이후 아래와 같이 연결해주도록 nginx 설정 파일을 수정해줍니다.

• '/' 연결 -> 프론트 서버
• '/api' 로 연결 -> API 서버

sudo vi /etc/nginx/sites-available/default

location / {
	// First ~~..
    
    proxy_pass http://localhost:8080/;
    proxy_redirect off;
    charset utf-8;
    
    proxy_set_header X-Real_IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_set_header X-NginX-Proxy true;
	
}

위와 같이 수정해주면, '/'로 오는 요청을 프론트 서버로 연결해줍니다.
'/api'로 오는 연결을 API 서버로 연결해주려면,

location /api {
    proxy_pass http://localhost:3000/api;
    proxy_redirect off;
    charset utf-8;
    
    proxy_set_header X-Real_IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_set_header X-NginX-Proxy true;
	
}

위와 같이 작성해주면 됩니다.

이때 혹시 오타 등을 검사하려면 sudo nginx -t 커맨드를 이용하시면 됩니다.

5. 백그라운드 실행

서버가 정상적으로 동작하는 것은 확인했는데, 한가지 문제가 있었습니다. 현재 서버를 MobaXterm 터미널로 실행했기 때문에, MobaXterm SSH 연결을 끊으면 서버가 종료되는 문제가 있었죠.

이러한 문제를 해결하기 위해서는 nohup과 백그라운드 실행 옵션인 '&'를 이용하시면 됩니다.
예를 들어, 'sudo nohup java -jar [Jar 파일] &' 커맨드로 실행하시면 됩니다.

서버를 종료하고 싶을 때는 2가지 방법이 있습니다.

• ps -ef | grep java 와 같이 프로세스를 확인하고 종료
• sudo netstat -tnlp 를 통해 포트 상태, 프로세스 번호확인 후 종료

종료는 'kill -9 [PID]' 명령어를 이용하면 됩니다.