[Nginx] 실습 1 - SpringBoot를 Port Proxy로 띄워보기

저번 포스팅에서는 전반적으로 Nginx의 이론적인 부분을 다루었다. 이번에는 실제 Nginx를 활용해 Reverse Proxy중 Port Proxy를 활용해 프로젝트를 띄워보자!

개발 환경

• OS : Linux Ubuntu 22.04 LTS
• Front-End : React
• Back-End : SpringBoot(eGov)
• Nginx는 설치하지 않았다고 가정

1. Nginx 설치

Ubuntu에 Nginx 설치

sudo apt update
sudo apt install nginx

2. Nginx 설정 파일 편집

• Nginx 설정 파일은 /etc/nginx/sites-available/default에 있음
• 이 파일을 편집하여 리버스 프록시를 설정

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

3. 설정 파일에 리버스 프록시 설정 추가

• 다음 내용을 설정 파일에 추가
• 여기서 8080 포트는 Spring Boot 애플리케이션이 실행 중인 포트
• Nginx가 수신할 포트
  • 80, 81, 82 등의 숫자 중 임의로 할당

server {
    listen 80;  # Nginx가 수신할 포트

		server_name localhost;

    location / {
        proxy_pass http://localhost:8080;  # 모든 요청을 Spring Boot 애플리케이션으로 전달
        proxy_set_header Host $host;  # 원래 요청의 Host 헤더를 전달
        proxy_set_header X-Real-IP $remote_addr;  # 클라이언트의 IP 주소를 전달
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;  # 포워딩된 IP 주소
        proxy_set_header X-Forwarded-Proto $scheme;  # 원래 요청의 프로토콜 (http/https)
    }
}

4. Nginx 설정 테스트 및 재시작

• 설정을 저장하고 Nginx 설정이 올바른지 테스트한 후, Nginx를 재시작

sudo nginx -t  # 설정 파일 테스트
sudo systemctl restart nginx  # Nginx 재시작

5. 브라우저에서 테스트

웹 브라우저를 열고 http://domain-name:portNubmer(예:http://localhost:82)으로 접속하여 Spring Boot 애플리케이션이 정상적으로 동작하는지 확인합니다.

6. 결과 화면

→ http://localhost:8080 으로 들어왔을 때

• Nginx를 거쳐서 들어오지 않았을 때

→ http:localhost:80 으로 들어왔을 때

• Nginx를 거쳐서 들어왔을 때
  • 성공!!!

→ Main Page가 아닌 URL로 들어왔을 때

• Nginx로 들어와도 문제없이 구동됨

To Do

지금은 내 프로젝트에서 Back-end를 담당하는 SpringBoot(eGov)만 다루었다.
하지만, 내 프로젝트는 실질적으로 Front-End를 담당하는 React와 함께 구성되어 있다.

React는 Port가 3000이고, SpringBoot는 Port가 8000이다. 하나의 프로젝트에서 움직이는데, 과연 Nginx 설정 파일에 location을 2개를 만들어야 할까, 아니면 1개로만 처리하면 될까? 그것은 다음 포스팅에!