로컬 네트워크에서 호스트를 자동으로 검색하기

2025-07-06

easy display

Easy Display는 로컬 네트워크에서 슬라이드쇼를 재생할 수 있도록 도와주는 도구입니다. 지인의 부탁으로, Android 기반 사이니지 TV에 준비한 이미지나 영상을 슬라이드쇼 형태로 보여주고 이를 손쉽게 관리할 수 있는 프로그램이 필요하다는 요청을 받아 개발하게 되었습니다.

사용자는 Android TV에 설치된 클라이언트 앱을 통해, Host PC에서 구성한 슬라이드쇼 화면을 자동으로 연결하여 볼 수 있습니다. 이 과정에서 사용자의 불편을 줄이고, 네트워크 환경에 구애받지 않도록 UDP 기반 브로드캐스트 방식을 활용했습니다.

이번 글에서는 Easy Display를 개발하며 겪은 문제와 그것을 해결하는 과정에서 알게 된 네트워크 통신 방식들을 정리하고 어떤 방식으로 프로젝트에 적용했는지에 대해 정리했습니다.

EasyDisplay Github 바로가기

왜 고민을 하게 되었는가?

TV가 스스로 로컬 네트워크에 있는 호스트를 찾아낼 수는 없을까?

처음엔 TV 앱에서 사용자가 직접 호스트 PC의 IP 주소를 입력하는 방식을 고려했습니다. 하지만 리모컨 조작으로 IP 주소를 하나하나 입력하는 UX는 현실적으로 너무 불편했습니다. 그래서 앱을 켜기만 하면, 로컬 네트워크 내의 호스트를 자동으로 검색하고 연결할 수 있는 구조가 필요했습니다.

여기서 연결이란 의미는 TV 앱 자체가 슬라이드쇼를 렌더링하는 구조였기 때문에, TV앱에 부여된 슬라이드 데이터만 호스트에서 받아오는것을 의미합니다.

어떻게 호스트의 IP 주소를 알아낼 수 있을까?

문득 예전에 사용했던 원격 스트리밍 앱 'Moonlight'가 떠올랐습니다. 아이패드에 설치된 Moonlight 클라이언트가 로컬 네트워크에서 자동으로 Host PC를 검색해 연결하던 경험이 있었죠. 그래서 이와 비슷한 방식으로 구현할 수 없을까 하고 조사해보니, 'UDP', '브로드캐스트'라는 키워드를 발견하게 되었습니다.

클라이언트가 브로드캐스트 방식으로 로컬 네트워크의 모든 기기에 '나 여기 있어요!'라고 메시지를 보내고, 호스트 PC가 이를 수신해 응답하는 방식이라면 자동 검색이 가능하겠다는 생각이 들었습니다. 이 구조를 구현하기 위해, 먼저 필요한 네트워크 통신 개념부터 정리해 보기로 했습니다.

필요한 네트워크 개념을 정리해보기

곧바로 개발에 들어가기에 앞서, 통신 프로토콜과 네트워크 구조에 대해 기본적인 공부가 필요했습니다. 단순히 단어만 알고 있던 개념이 아니라, 실제로 어떻게 동작하는지를 이해해야 구현이 가능했기 때문입니다.

정리한 주요 개념은 다음과 같습니다:

  • 브로드캐스트: 네트워크 내의 모든 호스트에게 메시지를 전송하는 방식
  • 유니캐스트: 특정 호스트에게만 메시지를 전송하는 방식
  • 멀티캐스트: 특정 그룹의 호스트에게 메시지를 전송하는 방식

통신 프로토콜:

  • TCP: 연결형 프로토콜. 신뢰성 있는 데이터 전송을 보장하지만, 상대와 먼저 연결을 맺어야 함
  • UDP: 비연결형 프로토콜. 빠르고 가볍지만 패킷 손실이나 순서 보장은 없음

이 중에서 브로드캐스트는 사실상 UDP에서만 지원되며, TCP나 HTTP, WebSocket 같은 연결 기반 프로토콜에서는 사용할 수 없습니다. TCP는 특정 호스트와의 연결을 전제로 하기 때문에, 255.255.255.255와 같은 주소로는 연결 자체가 불가능합니다.

정리한 내용을 바탕으로 시나리오를 만들어보기

호스트발견 시나리오

브로드캐스트와 UDP 소켓 통신 개념을 이해하고 나서, 다음과 같은 흐름으로 시나리오를 구성했습니다:

  1. TV 앱이 약속된 포트로 주기적으로 자신정보를 담은 메시지를 브로드캐스트로 전송합니다. (브로드캐스트)
  2. Host PC는 약속된 포트에서 메세지를 수신하고, 수신할때마다 그에 대한 응답으로 Host의 정보가 담긴 메세지를 발신지의 IP주소+포트로 전송합니다. (유니캐스트)
  3. TV 앱은 응답을 수신하고, Host 발견 UI를 표시합니다.
  4. 사용자가 Host를 선택하면, TV 앱은 해당 Host의 IP 주소로 슬라이드 데이터를 요청합니다.

macOS에서 발생한 문제

macOS에서 UDP 브로드캐스트를 사용하기 위해서는 추가적인 권한 설정이 필요했습니다. macOS는 보안상의 이유로 네트워크 통신에 대한 권한을 엄격하게 관리하고 있기 때문입니다. 이를 해결하기 위해 entitlements.mac.plist 파일에 다음과 같은 권한을 추가해야 했습니다.

<key>com.apple.security.network.client</key>
<true/>
<key>com.apple.security.network.server</key>
<true/>
<key>com.apple.security.network.broadcast</key>
<true/>

실제 구현 모습

Easy Display의 Host 앱은 Electron + React로, Android TV 앱은 React Native로 개발했습니다. 실제로 지인의 매장에서 사용할 수 있도록 빠르게 프로토타입을 제작하고 테스트를 진행했습니다.

구동모습

구동모습