로컬 환경에서 외부 요청 받기

요즘 서버리스 프레임워크로 간단한 웹서버를 만들고 있다. 슬랙과 연동해야 하는 작업이 있는데, 슬랙에서 사용자의 요청을 웹 서버에서 인식하기 위해서는 외부로 노출된 주소와 포트가 필요하다. 그래야 연동을 할 수 있다. 서버는 있는데 외부로 노출을 시키지 못하면, 아무것도 할 수가 없기 때문이다. 

 

로컬에서 외부로 주소를 내보낼 때는 포트포워딩을 통해서 보내야 하지만, 개인 공유기가 아닌 곳에서는 포트포워딩을 하기가 거의 불가능하다. 그래서 디버깅 하기 매우 힘든데, 로컬 환경을 외부로 노출 시켜주는 매우 좋은 툴이 있었다. 이걸 왜 지금 알았을까;;

 

ngrok 사용하기

---

일단 이 프로그램을 사용하면 로컬의 특정 포트를 외부로 노출할 수 있다. 

https://ngrok.com/

ngrok - Online in One Line

 

간단히 express 서버를 만들어 실행해 보자.

const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

이후 ngrok을 실행한 주소를 입력해도, 같은 서버가 뜨게 된다.

 

설정방법은 터미널에서 아래의 명령어를 치면은 된다. (Mac 기준)

 brew install ngrok/ngrok/ngrok  # ngrok 설치
 ngrok config add-authtoken <token>  # ngrok 홈페이지에 가입을 하게되면 토큰을 준다. 토큰을 입력하자
 ngrok http 80  # 로컬의 80번 포트를 외부로 노출시킬 수 있다.

 

이후에는 외부로 노출한 주소가 표시된다. 해당 주소는 Free plan 기준으로 1회 8시간, 실행할 때마다 랜덤하게 주소가 바뀌게 된다. 회원가입 이후 auth 토큰을 입력한 경우에는 시간제한이 증가하는 것으로 알고 있다.

 

사용 예시

---

개발중인 서버를 어디선가 시연해야 할 때, 로컬에 있는 개발서버를 외부로 잠깐 노출해야 할 때 해당 프로그램을 쓰면 좋다. 어디서든 개발서버로 접속해서 프로그램 실행 과정을 볼 수 있기 때문. 

 

나의 경우에는 sms 서비스, 카카오톡 및 슬랙 챗봇 개발 시에 사용하면 좋겠다는 생각이 들었다.