windows에서 ngrok 사용법 정리(로컬 서버를 외부에 공개 가능)

1. ngrok이란?

ngrok :내 PC localhost에서 실행 중인 웹 서버를 외부에서 접속 가능하게 만들어주는 터널링 도구

 

내 컴퓨터에서만 보이는 localhost 주소를 외부에서도 접속 가능한 https 주소로 바꿔주는 도구

 

2. 왜 사용할까? 

1. 포트폴리오 공유의 목적 

로컬에서 만든 프로젝트를 배포 없이 바로 다른 사람에게 보여줄 수 있음 

 

2. 외부 테스트가 필요할 때 

모바일 접속 테스트 / 외부 네트워크에서 확인 / 결제 API나 웹훅 테스트 

 

3. 협업 중 빠른 확인이 필요할 때 

팀 프로젝트 중 기능 확인이 바로 필요할 때 서버 배포없이 링크 공유 가능 

 

3. 장단점

장점 

- 설치 및 사용 방법 쉬움

- 웹훅 테스트에 유용

 

단점 

- 세션이 끊기면 주소 변경

- 계속 켜두어야 접속 가능

 

4. ngrok 다운로드

Download ngrok

Download ngrok

 

microsoft store 말고 download 선택한 다음에 

파란색 Download 버튼 클릭

 

관리의 편리성을 위해 C드라이브에 tools 폴더를 만들고 설치하였다 

C드라이브에 폴더 생성

 

5. Windows에서 ngrok 사용방법

① ngrok.exe 설치된 경로 찾기 

C:\tools\ngrok 

해당 폴더 이동

② ngrok.exe 실행

exe 실행 파일

③ ngrok 로컬 포트 연결하기

아래의 명령어 입력 

기본 웹서버 포트 : 

ngrok http 80

 

만약 8080포트 사용중이라면 :  

ngrok http 8080

 

프로그램 실행하고 명령어 입력하기

 

 

※ 이미 실행중이다 에러가 뜨는 경우 

taskkill /IM ngrok.exe /F

 

 

taskkill 명령어 실행 후 다시 ngrok 포트 연결

ngrok http 80

 

4. Forwarding 주소 확인 

 

Forwarding :

https://xxx.ngrok-free.dev -> http://localhost:80

https://xxx.ngrok-free.dev 이 주소가 외부에서 접속 가능한 본인 주소입니다

 

※ 주의사항 : ngrok은 무료 프로그램이라 세션이 끊기면(ngrok 터널을 껐다 키면) 주소가 바뀐다 

다시 확인이 필요함 

 

5. 프로젝트 주소 변경 테스트

주소에서 localhost 부분에 본인 주소 적용해주면 된다 

 

기존 주소 :

http://localhost/neighborhood-place/public/search.php에 적용할 경우 

 

바뀐 주소 : 

☞ https:// xxx.ngrok-free.dev/neighborhood-place/public/search.php가 된다