code-server세팅

오늘 배운 것

데스크탑(Windows/Linux), 노트북 등 여러 컴퓨터를 사용하다 보니 개발 환경을 하나로 통일하고 싶다는 생각이 들었다. 매번 다른 환경에서 git으로 코드만 동기화하는 것은 번거로웠고, 인터넷만 되면 어디서든 동일한 환경에 접속하여 작업하고 싶었다. 이 문제를 해결하기 위해 code-server를 알게 되어 내 리눅스 노트북에 구축을 시도했다.

code-server는 지정된 서버 컴퓨터에서 VS Code를 실행하고, 사용자는 웹 브라우저를 통해 해당 VS Code 환경에 접속하여 원격으로 개발할 수 있게 해주는 도구다. 즉, 개발 환경 전체를 클라우드화하는 것이다.

1. 초기 설정과 보안 강화 시도

먼저 code-server를 설치하고 비밀번호 인증 방식으로 외부 접속이 가능하도록 기본 설정을 마쳤다. 하지만 단순히 포트를 열고 비밀번호로만 접속하는 것이 보안상 불안하다고 느껴, 더 강력한 인증 방식을 도입하기로 했다.

Nginx를 리버스 프록시로 code-server 앞에 두고, 클라이언트 인증서(mTLS) 를 통해 허가된 기기만 접속할 수 있도록 구성을 시도했다. 이 방식은 비밀번호(아는 것)와 인증서 파일(가진 것)을 모두 요구하는 2단계 인증과 같은 원리로, Nginx라는 경호원이 서버 입구에서 허가된 신분증(인증서)을 가진 사람만 들여보내 주는 방식이었다.

2. 트러블슈팅 과정에서 배운 것

인증서 방식으로 전환하는 과정은 순탄치 않았고, 여러 문제를 해결하며 많은 것을 배울 수 있었다.

• Windows 네트워크 오류: 데스크탑(Windows)에서 ping 테스트 시 ‘일반 오류’가 발생하며 내부 네트워크 통신이 전혀 안 되는 문제가 있었다. 이는 NordVPN 프로그램이 네트워크 스택에 깊숙이 관여하여 발생한 문제였고, VPN 프로그램을 완전히 삭제하고 netsh winsock reset 명령어로 네트워크 스택을 초기화하여 해결했다. 이 경험을 통해 서드파티 프로그램이 시스템 네트워크에 미치는 영향을 직접 확인했다.

• 인증서 생성 및 등록의 복잡성: openssl을 이용해 자체 서명 인증 기관(CA)과 인증서를 만드는 과정은 매우 복잡했다. 특히, 생성된 client.p12 파일을 Chrome 브라우저에 등록할 때 ‘손상된 파일’ 오류가 계속 발생했다. 파일을 더블클릭하여 Windows의 ‘인증서 가져오기 마법사’를 통해 시스템에 직접 등록하는 표준적인 방법으로 해결했지만, 이 과정에서 상당한 시간이 소요되었다.

• Nginx와 웹소켓 문제: 인증서 문제를 해결하고 접속했을 때, WebSocket 연결 오류(코드 1006)가 발생하며 code-server가 정상적으로 동작하지 않았다. 이는 Nginx가 웹소켓 프로토콜을 제대로 처리하도록 추가 설정(proxy_set_header Upgrade… 등)을 해주어야 해결되는 문제였다.

3. 최종 결정: 안정적인 비밀번호 방식으로 회귀

인증서 방식이 보안적으로는 우수하지만, 설정의 복잡성, 여러 단계의 트러블슈팅, 그리고 Nginx 프록시 설정의 미묘한 문제들로 인해 초기 목표였던 ‘간편한 원격 접속’과는 거리가 멀어진다고 판단했다.

결과적으로, 안정성과 단순성을 우선하여 다시 원래의 비밀번호 인증 방식으로 돌아가기로 결정했다.

최종 구성은 다음과 같다:

• code-server 설정: config.yaml 파일에서 bind-addr를 0.0.0.0:xxxx로, auth를 password로 설정.

• 방화벽: sudo ufw allow xxxx 명령어로 code-server가 사용하는 포트를 허용.

• 포트 포워딩: 공유기에서 외부 IP의 특정 포트(xxxx)로 들어오는 요청을 code-server 노트북의 내부 IP(192.168.x.xx)와 포트로 전달.

비록 가장 복잡한 구성을 채택하지는 않았지만, 이 모든 과정을 통해 서버, 네트워크, 방화벽, 그리고 보안 인증서의 작동 원리에 대해 깊이 이해할 수 있는 값진 경험이었다.

내일 할 일

1. 스프링 공부