WebRTC 보이스채팅 개발하기 - 2. 데모 소스

 

이론 아무리 봐도 모를 때는 데모소스 보고 따라가보면 이해 되기도 합니다.

가장 괜찮은 데모소스를 찾았습니다.

 

데모 소스

https://github.com/anoek/webrtc-group-chat-example

GitHub - anoek/webrtc-group-chat-example: Small but complete example of how to use WebRTC to setup voice and/or video chat betwe

 

 

서버는 Node.JS이고, 클라이언트측은 html로 되어 있습니다.

환경 만들어서 돌려보니 잘 되네요.

 

소스 중에서 SIGNALING_SERVER 서버 URL 수정하고, 로컬 streams은 src로 연결 안되게(내가 말하는 것이 들려서) 주석 처리만 했습니다.

 

소스 분석

클라이언트가 Node.JS 서버(Signaling 서버)의 웹소켓으로 접속하면 아래와 같은 메시지를 주고 받습니다.

 

① A클라이언트가 AAA 채널에 참가 할께라고 서버에 join 메시지 보냄

② B클라이언트도 AAA 채널에 참가 할께라고 서버에 join 메시지 보냄

③ 그럼 A클라이언트와 B클라이언트가 addPeer 서로 상대방을 정보를 추가하고, 어떻게 보이스 연결을 할 것인지 SDP, ICE candidate 같은 메시지를 주고 받습니다.

중간에서 Node.JS 서버(Signaling 서버)가 웹소켓 세션관리, 채널 관리 같은 것을 하면서 중계를 합니다.

 

 

Node.JS → Java Spring Framework

Node.JS를 별로 좋아하지도 않고, 기존에 운영중인 서비스들이 스프링으로 되어 있는지라 저는 스프링으로 변경을 해야만 합니다.

Node.JS에서는 웹소켓을 Socket.io라는 것을 사용하는데, 스프링에서는 없는 라이브러리라서 좀 손을 대야 합니다.

 

아무튼 이틀동안 분석하고, 이해하고, 열심히 삽질하다 보니 Node.JS에서 스프링으로 변경 성공했습니다.

변경 작업 하고 나니 이제 좀 감이 잡힙니다.

내부적인 WebRTC 이해도는 없고 API 사용방법만 아는 수준 정도만요.

 

 

다음 작업은 서로 다른 네트워크 환경의 "공유기 - 공유기"에서 가능하도록 TURN 서버를 구축해보겠습니다.

 

 

 

※ 위 내용은 랜덤보이스채팅 이오이카를 개발하면서 공부한 내용입니다.
https://voice.eoeca.com