[Webpack dev server] 'Invalid Host header' 에러

1. 문제의 시작

웹팩 개발 서버(webpack dev server)를 'ngrok'로 외부에 노출 시켜서 접속했더니

'Invalid Host header' 에러가 납니다.

 

2. 'Invalid Host header'의 원인

웹팩 개발 서버에서는 호스트 검사를 해서 외부 접속을 차단하기 때문에 발생한다고 합니다.

 

 

3. 해결 방법

외부 접속도 허용하면 됩니다.

 

웹팩 개발 서버 설정에 다음을 추가합니다.

allowedHosts: "all"

예전 버전(3 이전 버전)의 경우
disableHostCheck: true
를 추가해야 합니다.

 

이제 잘 접속됩니다.

 

 

마무리

웹팩 개발 서버로 운영하는 경우는 거의 없을 거 같은데 설정 하다보면

'그냥 운영해도 되지 않을까?'

라는 생각이 들게 합니다 ㅎㅎㅎ