ServBay에서 Ngrok 리버스 프록시 서비스 설정 가이드

Ngrok은 로컬에서 구동 중인 웹 서비스를 안전하게 공용 인터넷에 노출할 수 있는 강력한 도구입니다. ServBay에 Ngrok을 통합하면, 로컬 개발 웹사이트에 손쉽게 안전한 공용 접근 터널을 만들 수 있어 프로젝트 시연, Webhook 테스트, 팀 외부 구성원과의 공유에 매우 효율적입니다. 이 가이드는 ServBay에서 Ngrok 리버스 프록시 서비스를 설정하고 사용하는 방법을 단계별로 안내합니다.

개요

ServBay는 Ngrok을 내장 지원하여 설치와 설정을 매우 간편하게 제공합니다. ServBay의 그래픽 인터페이스에서 직접 Ngrok 터널을 관리하고, ServBay에 등록한 로컬 사이트를 임시 공용 URL로 매핑할 수 있습니다.

주요 활용 사례

• 고객 프레젠테이션: 로컬 컴퓨터에서 개발 중인 웹사이트를 고객에게 실시간으로 시연.
• Webhook 개발: 결제 게이트웨이, API 등 외부 서비스의 공용 콜백 URL 테스트.
• 모바일 앱 테스트: 공용 URL을 통해 모바일 장치에서 로컬 백엔드 API 접근 가능.
• 협업 개발: 임시로 팀 멤버와 로컬 개발 환경을 안전하게 공유.

사전 준비

1. ServBay 설치: macOS 시스템에 ServBay가 정상 설치 및 실행되고 있어야 합니다.
2. Ngrok 계정: Ngrok 계정이 필요합니다. Ngrok 공식 웹사이트에서 무료 또는 유료 계정을 생성하세요.
3. 로컬 웹사이트: ServBay에 로컬 사이트가 하나 이상 추가되고 실행 중이어야 합니다. 예: servbay.demo.

설정 단계

1. ServBay에서 Ngrok 패키지 설치

Ngrok을 처음 사용할 경우, ServBay에서 먼저 설치해야 합니다.

1. ServBay 애플리케이션을 실행합니다.
2. 좌측 네비게이션 바에서 소프트웨어 패키지 (Packages) 를 클릭합니다.
3. 패키지 목록에서 Ngrok을 찾거나 검색합니다.
4. Ngrok 옆에 있는 설치 버튼을 클릭합니다.
5. 설치가 완료되면, Ngrok 우측에 위치한 시작 스위치를 눌러 실행을 시도합니다. 이때, 아직 설정이 완료되지 않았으므로 서비스가 시작에 실패하거나 상태가 비정상적으로 표시될 수 있습니다. 이는 정상이며, 다음 단계에서 설정을 이어가면 됩니다.

2. Ngrok Authtoken 발급받기

Ngrok은 Authtoken을 통해 계정을 인증하고 서비스 사용 권한을 부여합니다.

1. Ngrok 대시보드에 접속하여 로그인합니다.

2. 로그인 후 대시보드 왼쪽의 Your Authtoken 메뉴로 이동합니다 ("Getting Started" -> "Your Authtoken").

3. 자신의 Authtoken을 복사합니다. 긴 문자열이므로 안전하게 보관하세요.

   

3. ServBay에서 Ngrok 설정하기

Authtoken을 복사한 후, ServBay에서 Ngrok 설정을 진행합니다.

1. ServBay 좌측 네비게이션 바에서 Tunnel을 클릭합니다.

2. Tunnel 서비스 목록에서 ngrok을 선택합니다.

   

3. Auth Token (인증 토큰):

   • Auth Token 입력란에 앞서 복사한 Ngrok Authtoken을 붙여넣습니다.

4. 터널 설정 (로컬 도메인 및 외부 도메인): ServBay는 여러 로컬 사이트에 대해 Ngrok 터널을 생성할 수 있습니다.

   • Local Domain (로컬 웹사이트):
     • 드롭다운 메뉴를 클릭하여, Ngrok을 통해 외부에 공개할 로컬 사이트를 선택하세요. 이 목록에는 ServBay에 추가된 사이트(예: servbay.test 또는 servbay.demo)가 자동으로 표시됩니다.
   • External Domain (외부 도메인):
     • Ngrok 무료 사용자라면: 이 필드를 비워 두세요. Ngrok은 자동으로 .ngrok-free.app(또는 기타 무료 도메인)으로 끝나는 임의의 공용 URL을 생성합니다. 터널이 성공적으로 시작되면 ServBay가 자동으로 해당 URL을 표시합니다.
     • Ngrok 유료 사용자라면: Ngrok 계정에 맞춤 또는 예약 도메인을 등록해 두었다면 이 필드에 원하는 외부 도메인을 입력할 수 있습니다.

5. 터널 추가:

   • 여러 로컬 사이트용 터널이 필요하다면, 기존 터널 항목 우측의 + (플러스) 버튼을 눌러 새 터널 설정을 추가하세요. 위의 4번 과정을 반복하여 로컬 사이트 및 외부 도메인을 지정합니다.

6. 설정 저장:

   • 모든 설정을 마쳤다면 우측 하단의 Save (저장) 버튼을 클릭합니다.

4. Ngrok 서비스 시작 및 확인

1. 설정 저장 후, ServBay는 새 설정으로 Ngrok 서비스를 구동 시도합니다.
2. ngrok 서비스 항목 옆의 상태 표시등을 확인하세요. 설정이 올바르고 Ngrok에 정상적으로 연결되면 녹색으로 변하며, 서비스가 구동 중임을 나타냅니다.
3. 각 성공적으로 시작된 터널 항목의 External Domain 필드(이전에 공란인 경우)에 Ngrok이 할당한 공용 URL이 표시됩니다.
4. 접속 확인:
   • 외부 도메인 옆의 복사 아이콘을 클릭하여 해당 URL을 복사합니다.
   • 또는 브라우저 아이콘(주로 나침반 또는 지구본 모양)을 클릭해 기본 브라우저로 바로 접속할 수 있습니다.
   • 모든 설정이 정상적이라면, 이 Ngrok URL을 통해 외부에서도 로컬 웹사이트에 접속 가능합니다.

5. Ngrok 터널 관리

ServBay의 Ngrok 설정 화면에서:

• 외부 도메인 복사: 복사 아이콘으로 URL을 간편하게 복사해 공유할 수 있습니다.
• 브라우저로 열기: 브라우저 아이콘을 클릭해 즉시 접근 테스트.
• 터널 추가: + 아이콘 클릭.
• 터널 삭제: - (마이너스) 아이콘을 클릭하면 필요 없는 터널 설정을 삭제할 수 있습니다.
• 서비스 중지: ngrok 서비스 항목 옆의 스위치로 전체 Ngrok 서비스를 일시 정지하거나 재시작할 수 있습니다.

유의사항

• Ngrok 무료 버전 제한: 무료 버전은 외부 도메인이 매번 변경될 수 있고(서비스/터널 재시작 시마다), 동시 연결 수, 대역폭, 사용 시간 등에 제한이 있습니다. 고정 도메인 등 고급 기능이 필요하다면 유료 플랜으로 업그레이드하세요.
• 로컬 서비스 상태: Local Domain으로 선택한 사이트가 ServBay에서 정상 운영 중이어야 합니다(예: 해당 PHP 버전, 웹서버(Nginx/Apache) 구동, 사이트 설정 정상 등). Ngrok은 트래픽 포워딩만 담당하며, 로컬 서비스 실행/수정에는 관여하지 않습니다.
• 방화벽: macOS 방화벽이나 써드파티 보안 소프트웨어가 ServBay 또는 Ngrok의 네트워크 연결을 막지 않도록 설정하세요.
• HTTPS: Ngrok은 기본적으로 터널에 HTTPS를 지원하여, 현대 웹 개발 및 테스트에 특히 유용합니다.

자주 묻는 질문 (FAQ)

• Q: Ngrok 서비스가 시작에 실패하고 상태 표시등이 빨간색/주황색입니다. 어떻게 하죠?
  • A: Ngrok Authtoken이 정확히 입력되었는지 먼저 확인하세요. 인터넷 연결 문제는 없는지, Ngrok 공식 사이트 접속이 정상인지 점검하세요. 서비스 우측의 log 아이콘을 클릭해 상세 오류 로그를 확인해 추가 정보를 얻을 수 있습니다.
• Q: Ngrok 무료 이용자인데 External Domain 필드가 비어있거나 "Leave blank if you're a free user"라고 표시됩니다. 문제인가요?
  • A: 정상입니다. 무료 사용자는 이 필드를 비워두면 됩니다. 터널이 성공적으로 시작되면, ServBay가 Ngrok으로부터 자동으로 임의 공용 URL을 받아 표시합니다.
• Q: Ngrok과 frp, Cloudflared 등 다른 터널 서비스를 동시에 사용할 수 있나요?
  • A: ServBay는 다양한 터널 서비스를 설치 및 설정할 수 있습니다. 필요에 따라 한 가지 또는 복수 서비스를 선택적으로 실행할 수 있습니다. 단, 여러 터널 서비스를 동시에 돌려 하나의 로컬 사이트를 외부에 노출하면 설정 충돌 및 네트워크 라우팅 이슈가 발생할 수 있으니 주의해야 합니다.

정리

ServBay의 Ngrok 통합 덕분에 웹 개발자는 macOS에서 로컬 개발 환경을 외부에 공개하는 작업을 크게 단순화할 수 있습니다. 빠른 데모, Webhook 통합 테스트, 협업 환경 공유 등 다양한 상황에 신속하고 효율적으로 대응할 수 있습니다. Ngrok 계정 유형(무료/유료)에 따라 외부 도메인을 적절히 설정하고, 항상 로컬 서비스가 정상 실행되고 있는지 확인하세요.