ngrok 외부에서 로컬 서버 접속 환경 구성

ngrok

공식 페이지에서 ngrok은 NAT와 방화벽 뒤에 있는 로컬 서버를 안전한 터널을 통해 공개 인터넷에 노출시켜 주는 도구라고 설명되어 있습니다.

즉, 포트 포워딩과 같은 네트워크 환경 설정 변경없이 로컬에 실행중인 서버를 안전하게 외부에서 접근 가능하도록 해주는 도구입니다.

 

설치

npm install ngrok --save

 

React app 기본 실행 포트 80으로 변경

 

실행 코드

 

ngrok http 80

 

ngrok 실행 화면

외부 네트워크 환경에서 브라우저를 열고 http://19ed998b24bf.ngrok.io 입력하면 로컬에 실행 중인 서버 80 포트로 접속하여 확인할 수 있습니다.

 

대시보드

앞에서 터미널에도 접속 로그 등을 볼 수 있었지만(-inspect=false옵션을 주면 로그가 남지 않는다.) 실행하면 자동으로 웹에서 로그나 상태를 볼 수 있는 대시보드가 http://127.0.0.1:4040에 실행된다. 단순 개발할 때는 크게 필요하진 않아 보이지만 터미널 사용이 익숙지 않다면 웹으로 보는 것도 나쁘지 않다.