내가 개발 중인 서비스에서 테스트로 외부 접속이 필요한 경우, 프론트엔드-백엔드-AI 서버 등 여러 서비스를 동시에 노출해야 할 때, ngrok의 하위 도메인 기능을 활용하면 효율적인 개발 환경을 구성할 수 있습니다.
ngrok을 처음 사용해볼경우 이전에 작성한 ngrok 이용방법에 관한 글을 참고해 주세요.
윈도우11(Windows11) ngrok 설치 및 설정 방법
오늘은 Windows 11에서 ngrok을 설치하고 사용하는 방법에 대해 자세히 안내해 드리겠습니다. ngrok은 로컬 서버를 외부에서 접근할 수 있게 해주는 유용한 터널링 도구입니다. 특히 개발 중인 웹사이
newstroyblog.tistory.com
ngrok 요금제별 도메인 기능

요금제를 보면 최대 3개까지의 엔드포인트를 라이센스당 실행할 수 있고 상업적으로 이용이 가능하며 사용자정의 ngrok도메인을 생성할 수 있는 Pro요금제가 처음 사용하기에는 합리적이라고 생각됩니다. Personal 플랜은 비상업적 용도로 제한되므로, Pro 플랜을 추천합니다.
다중 서비스 설정 방법

ngrok의 도메인탭으로 이동하여 새로운 도메인을 생성할 수 있습니다.(링크)
이후에는 아래 ngrok.yml 파일을 통해 여러 서비스를 각각 다른 하위 도메인으로 노출할 수 있습니다.
# ~/.ngrok2/ngrok.yml
version: "3"
authtoken: YOUR_AUTH_TOKEN
tunnels:
frontend:
addr: 3000
proto: http
domain: testdomain.ngrok.io
backend:
addr: 4000
proto: http
subdomain: testdomain-api
ai-server:
addr: 8000
proto: http
subdomain: testdomain-ai
위와 같은 형태로 ngrok.yml 사전파일을 구성하면 되는데 도메인 라이센스당 최대 3개의 엔드포인트를 실행할 수 있어 frontend, backend, ai-server로 예를 들어 서브도메인으로 구성하였습니다.

authtoken의 경우에는 ngrok설치 페이지에서 확인할 수 있습니다.(링크)
실행 방법
ngrok start --all
모든 터널을 동시에 시작하려면 위 명령어를 사용합니다.
실제 적용 예시

이렇게 설정하면 각 서비스가 서브 도메인으로 독립적인 도메인을 가지면서도 하나의 ngrok 계정으로 관리할 수 있어 개발 및 테스트 환경에서 매우 유용합니다.