[Web-Server] 웹 서버에 도메인 및 서브도메인 연결하기

도메인 및 서브도메인 연결하기

라즈베리파이로 개인 서버를 구축하고, 이 서버에 젠킨스 및 토이 프로젝트 서버를 띄워 사용하고 있었다.

그런데 매번 ip 주소를 통해 접속하는 것이 번거롭고 URL에 ip 주소가 표시되는 것이 마음에 들지 않았다.
또한 하나의 도메인을 구매해서 여러 서브도메인을 적용하는 방법이 궁금하기도 했고, 추후에 SSL도 적용해서 https 환경으로 배포까지 할 계획이라 이 참에 라즈베리파이 서버에 도메인을 입혀 사용해보기로 했다.

아래 과정에서 개인 도메인을 구매하는 과정은 생략했다.

목표

내가 원하는 도메인 구조는 다음과 같다.

• www.domain.com : next.js를 이용한 클라이언트 애플리케이션(프론트엔드), port : 3000
• api.domain.com : spring를 이용한 서버 애플리케이션(백엔드), port : 8000
• dev-api.domain.com : 개발 테스트용 서버, port : 8888
• jenkins.domain.com : 젠킨스 CI/CD 서버, port : 9999

도메인 DNS 레코드 설정

domain.com 이라는 도메인이 있다고 가정할 때, api.domain.com, dev-api.domain.com과 같은 도메인들은 domain.com 도메인의 서브도메인들이다.
도메인을 구매한 사이트에서 DNS 레코드 설정을 통해 해당 서브도메인들을 네임서버에 등록해줘야 한다.
DNS 레코드 설정에서 CNAME 레코드들을 추가한다.

레코드 유형	이름	데이터
CNAME	www	domain.com
CNAME	api	domain.com
CNAME	dev-api	domain.com
CNAME	jenkins	domain.com

변경사항이 적용되면 www.domain.com, api.domain.com으로 접근해도 상위 도메인인 domain.com에 연결된 주소로 접속된다.

이제 도메인이 연결된 기기에 웹 서버를 설치하여 웹 서버에 서브도메인을 설정할 차례이다.

Nginx 설치 및 서브도메인 설정

도메인이 연결된 기기에 웹 서버(Apache, Nginx 등)를 설치한다.
나는 Nginx를 설치했다.

# Nginx 설치 명령어
$ apt-get install nginx

이후, /etc/nginx/sites-available 경로의 default 파일을 편집기로 열어 서브도메인으로 사용할 가상호스트 설정들을 추가해준다.

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

# ... 기존 설정 ...

# 가상 호스트 설정
server {
    listen 80;
    listen [::]:80;

    server_name www.domain.com;

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

server {
    listen 80;
    listen [::]:80;

    server_name api.domain.com;

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

server {
    listen 80;
    listen [::]:80;

    server_name dev-api.domain.com;

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

server {
    listen 80;
    listen [::]:80;

    server_name jenkins.domain.com;

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

설정 파일에 추가를 완료했으면 Nginx를 재시작하여 변경사항을 적용한다.

# nginx 재시작
$ systemctl restart nginx

이제 지정한 서브도메인으로 접속하면 접속이 잘 되는 것을 확인할 수 있다.

동작 방식

내가 이해한 동작 방식을 간단하게 설명하자면 아래와 같다.
(완벽히 이해한 것이 아니라 틀릴 수도 있다..)

1. api.domain.com으로 요청
2. DNS 서버에 api.domain.com의 ip 주소 요청
3. api.domain.com은 domain.com으로 연결됨 -> domain.com ip 주소 요청
4. DNS 서버에 등록된 domain.com의 ip 주소 확인 및 접속 요청
5. http 프로토콜의 경우 80번 포트로, https 프로토콜의 경우 443번 포트로 접속
   • domain.com에 연결된 ip 주소가 111.111.111.111이라면
     • http : 111.111.111.111:80
     • https : 111.111.111.111:443
6. Nginx는 접속 요청의 server_name을 확인하여 가상호스트에 등록된 proxy_pass로 포워딩한다.