봄수의 연구실

Webrtc 통신 방법 본문

DEV/Backend

Webrtc 통신 방법

berom 2023. 2. 28. 20:30

WebRTC 통신 설정하는 방법

Intro. 왜 궁금한가?

socket.io로 방 관리를 하고, 시그널링 서버와 미디어 서버를 배포했다. fastify로 서버 인스턴스도 만들고 말이다.
그런데 막상 시그널링 코드를 짜려고 보니, 모르는 것 투성이라 기록한다.

일반적인 연결 흐름은 어떻게 되는가?

사용자 연결

가장 먼저 해야 할 일은 사용자 간의 연결이다.
가장 쉬운 방법은 두 사용자가 동일한 웹 사이트를 방문하는 것이다.

웹 페이지는 각 브라우저를 판별하고, 방 번호나 유저 ID 등을 발급함으로써 유저를 특정한다.
그 후 socket.io 등으로 시그널링 서버에 연결한다.

시그널링 시작

동일한 웹 페이지에 사용자가 접근했으니 이제 시그널링 메시지만 교환하면 된다.

  • 시그널링 메세지란?
    • 단순히 브라우저 사이에서 WebRTC 통신을 설정/제어만 할 수 있다면 뭐든지 상관없다.
    • XHR 폴링이나 서버 전송 이벤트, socket 등을 사용한다.
    • 개발자가 시그널링하는 방법을 선택할 자유를 준 것이다.

후보의 발견

WebRTC는 당신도 알다시피 상호 간 직접 연결을 해야 한다.

후보 찾기 단계(finding candidate)에서는 최종적으로 각 브라우저가 직접 연결 가능한 네트워크 인터페이스와 포트에 맵핑 되어야한다.
보통 브라우저는 라우터와 NAT 뒷 단에 있는 경우가 흔해 연결을 하는데 제한이 있다.
이 때 시그널링 서버(STUN과 TURN 서버)를 사용한다.

WebRTC에서는 기본적으로 STUN 서버에 연결을 하지 못하는 경우 TURN 서버로 폴백한다.
또한, 이 전체 과정을 WebRTC에서는 ICE 프레임워크로 바인딩 된다.

미디어 세션 협상

서로 통신하는 방법을 알았으니, 코덱과 해상도, 비트 레이트 등 교환할 미디어 타입과 포맷에 대해 합의 해야 한다.
보통 이 과정을 SDP(세션 기술 프로토콜)이라고 한다.

RTCPeerConnection 스트림 시작

위의 과정이 완료 되었으면 브라우저는 직접 P2P 연결을 하거나, 또는 릴레이 되어 미디어 스트리밍을 시작 할 수 있다.
이 단계에서 두 브라우저는 WebRTC 통신 제어를 위해 토신 공유에 사용한 동일한 시그널링 솔루션을 사용할 수 있다.

서로 간의 직접 제어도 가능하다

레퍼런스

부족한 점이나 잘못 된 점을 알려주시면 시정하겠습니다 :>

728x90