client – public server – private server
위와 같은 구조의 접근 방법입니다. public server와 private server간에는 통신이 가능한데 client에서는 다이렉트로 private server에 접속불가한 상태입니다. private server에서 웹 서비스를 띄웠는데 public server의 터미널에서만 접속이 가능해서 client의 웹브라우저로는 페이지를 띄우는 게 불가능한 상황인거죠.
Visual Studio Code에는 Port Forwarding 기능이 있습니다. 해당 기능을 사용하면 client의 웹브라우저에서 forwarding된 port를 이용해서 private server에 접속이 가능합니다.
예를들면, 7000번 port가 private server에 맵핑되었다고 하면 client의 웹브라우저에서는 localhost:7000으로 웹페이지를 열면, 연결된 private server주소로 접속이 되는 것입니다.
구조 설명은 복잡했는데 동작은 간단합니다.
vs code로 remote-ssh 플러그인을 이용해 public server에 접속합니다. 그러면 아래와 같은 메뉴를 사용할 수 있습니다.
스크린샷에서 보는 것처럼 설정하면 됩니다. Port 부분에 입력되는 것이 private server 주소이고 Local Address는 자동으로 동일한 port가 할당됩니다. 이제 로컬PC에서 브라우저를 열어 localhost:8889에 접속하면 private server의 웹서비스에 접속 가능합니다.