WebSocket과 바이너리 데이터 전송의 과제
WebSocket은 클라이언트와 서버 간 실시간 양방향 통신을 가능하게 하는 강력한 프로토콜입니다. 하지만 초기 WebSocket 사양에서는 텍스트 형식의 데이터만 안정적으로 주고받을 수 있었기 때문에, 이미지·파일 같은 바이너리 데이터를 전송하려면 별도의 변환 과정이 필요했습니다. 이 문제에 대한 대표적인 해결책이 바로 Base64 인코딩/디코딩 방식입니다.
클라이언트와 서버에서 Base64 인코딩 활용하기
바이너리 데이터를 문자열 형태로 안전하게 전송하려면 클라이언트와 서버 양쪽에서 Base64 인코딩/디코딩을 사용하면 됩니다.
WebSocket을 지원하는 모든 최신 웹 브라우저에는 기본적으로 두 가지 내장 함수가 제공됩니다.
- window.atob: Base64 문자열을 디코딩
- window.btoa: 데이터를 Base64로 인코딩
덕분에 외부 라이브러리 없이 순수 자바스크립트만으로 바이너리 데이터를 문자열로 변환하거나, 받은 문자열을 다시 원래 데이터로 복원할 수 있습니다.
서버 측 역시 Node.js, Python, Java 등 주요 개발 환경에서 검증된 Base64 라이브러리를 폭넓게 지원합니다. 따라서 클라이언트와 서버가 동일한 인코딩 규격만 맞춘다면, 바이너리 데이터를 텍스트 채널을 통해 오류 없이 주고받는 구조를 쉽게 구성할 수 있습니다.
noVNC의 wsproxy: WebSocket–TCP 변환 프록시
실제 환경에서 바이너리 데이터를 전송할 때 유용하게 활용되는 도구가 바로 wsproxy입니다. wsproxy는 웹 기반 VNC 클라이언트인 noVNC에 함께 포함되어 배포되며, 브라우저만으로 원격 데스크톱 화면을 송수신할 수 있게 해줍니다.
wsproxy의 역할과 동작 방식
wsproxy는 이름 그대로 WebSocket 연결을 일반 TCP 소켓으로 변환해 주는 프록시 서버입니다. 핵심 특징은 다음과 같습니다.
- 브라우저와 주고받는 모든 트래픽을 Base64로 인코딩/디코딩하여 처리합니다.
- WebSocket을 지원하는 브라우저에서 어떤 종류의 TCP 포트든 연결할 수 있도록 중계합니다.
- VNC뿐 아니라 SSH, 데이터베이스 등 다양한 TCP 기반 서비스에도 응용할 수 있습니다.
즉, wsproxy는 브라우저의 WebSocket 통신과 기존 TCP 기반 애플리케이션 사이에서 다리 역할을 수행하며, Base64 변환을 통해 바이너리 데이터가 텍스트 채널에서도 안전하게 전달되도록 보장합니다.
마무리
WebSocket 환경에서 바이너리 데이터를 다루려면 클라이언트의 window.atob/window.btoa와 서버 측 Base64 라이브러리를 조합하는 것이 기본 전략입니다. 여기에 noVNC의 wsproxy를 함께 활용하면 WebSocket 미지원 서비스와도 손쉽게 연동할 수 있어, 실시간 데이터 전송 시스템을 구축할 때 매우 실용적인 선택지가 됩니다.