WebRTC(Web Real-Time Communication)는 브라우저 간 직접 실시간 통신을 가능하게 하는 표준 API다. 플러그인 없이 비디오 통화, 음성 통화, 데이터 공유를 구현한다. Zoom, Google Meet의 핵심 기술이다.
핵심 API
| API | 역할 |
|---|
| getUserMedia | 카메라/마이크 접근 |
| RTCPeerConnection | P2P 연결 수립 및 미디어 전송 |
| RTCDataChannel | 임의 데이터 전송 |
연결 수립 과정
1. 시그널링 (Signaling, 서버 통해):
Alice → SDP Offer → 시그널링 서버 → Bob
Bob → SDP Answer → 시그널링 서버 → Alice
2. ICE (Interactive Connectivity Establishment):
NAT 통과, 최적 경로 탐색
3. P2P 연결:
Alice ←→ Bob (직접 연결)
기본 예시
javascript
// 카메라 접근
const stream = await navigator.mediaDevices.getUserMedia({ video: true, audio: true });
document.getElementById('localVideo').srcObject = stream;
// P2P 연결
const pc = new RTCPeerConnection({ iceServers: [{ urls: 'stun:stun.l.google.com:19302' }] });
stream.getTracks().forEach(track => pc.addTrack(track, stream));
const offer = await pc.createOffer();
await pc.setLocalDescription(offer);
// offer를 시그널링 서버로 전송
관련 개념
- •WebSocket — WebRTC 시그널링에 활용
- •P2P — WebRTC의 탈중앙 통신 방식
- •UDP — WebRTC의 전송 프로토콜
참고문헌
- •MDN Web Docs — WebRTC API
