💻 Frontend
webRTC 기초
date
Jun 27, 2022
slug
webRTC
author
status
Public
tags
webRTC
모도코
summary
webRTC 기초에 대해 알아봅시다.
type
Post
thumbnail
category
💻 Frontend
updatedAt
Aug 3, 2023 09:29 AM
언어
1. 소개
webRTC 기본 개념 및 관련 기술에 대해 알아보자
2. webRTC란?
- Web Real-Time Communication
- 웹 브라우저, Android, IOS 애플리케이션에서 사용 가능한 비디오 / 음성 / 일반 데이터가 peer간에 실시간으로 전송되도록 지원하는 오픈소스
P2P 절차
webRTC는 p2p 방식의 커뮤니케이션이기 때문에 각각의 웹 브라우저는 아래와 같은 절차를 밟아야 한다.
1. 각 브라우저가 p2p 커뮤니케이션에 동의한다.
2. 서로의 주소를 공유한다.
3. 보안 사항 및 방화벽 우회를 한다.
4. 멀티미디어 데이터를 실시간으로 교환한다.
여기서 2, 3번은 일반적인 웹 개발 접근 방법으로는 해결하기가 어렵다. 왜냐! 브라우저는 웹 서버가 아니여서 외부에서 접근할 수 있는 주소가 없다. 따라서 webRTC가 p2p 기반이긴 하지만 통신 설정 초기 단계에서는 중재자 역할이 필요하다.
3. webRTC의 기술
3-1. ICE와 Candidate
- Interactive Connectivity Establishment
- 두 개의 단말이 P2P 연결을 가능하게 하도록 최적의 경로를 찾아주는 프레임워크
- ICE 프레임워크가 STUN 또는 TURN 서버를 이용해 상대방과 연결 가능한 후보들을 갖고 있음
- stun, turn 서버를 이용해 획득했던 ip 주소와 프로토콜, 포트의 조합으로 구성된 연결 가능한 네트워크 주소들을 Candidate라고 부름.
- candidate를 수집하면 일반적으로 3개의 주소를 얻음
- 자신의 사설 IP와 포트 넘버
- 자신의 공인 IP와 포트 넘버 (STUN, TURN 서버로부터 획득 가능)
- TURN 서버의 IP와 포트 넘버 (TURN 서버로부터 획득 가능)
- ICE가 stun, 또는 turn 서버를 이용해 상대방과 연결 가능한 후보들을 갖고 있음
3-2. 방화벽과 NAT 트래버셜
- 일반적인 컴퓨터에는 공인 IP가 할당되어 있지 않음.
- NAT: network address translation, IP 패킷의 TCP/UDP 포트 숫자와 소스 및 목적지의 IP 주소 등을 재기록하면서 라우터를 통해 네트워크 트래픽을 주고 받는 기술.
- 단순히 공인 IP 만을 알아낸다고 해서 특정한 사용자를 가리킬 수 없음
- 공인 IP 뿐만 아니라 해당 네트워크에 연결된 사설 IP 주소까지 알아내야 특정한 사용자를 지정할 수 있음!
- 일반적으로 라우터가 NAT 역할을 함.
- 외부에서 접근하는 공인 IP , 포트 번호 → 현재 네트워크 내의 사설 IP (매핑)
- 어떤 브라우저 두 개가 서로 직접 통신하려면 각자 현재 연결된 라우터의 공인 IP 주소와 포트를 먼저 알아내야 함.
- 하지만 어떤 라우터들은 특정 주소나 포트와의 연결을 차단하는 방화벽이 설정되어 있을 수도 있음
- 라우터를 통과해서 연결할 방법을 찾는 과정을 NAT 트래버셜이라고 함.
- 이는 서버에 의해 이루어짐.
3-3. STUN, TURN
- STUN : 단말이 자신의 공인 IP 주소와 포트를 확인하는 과정에 대한 프로토콜
- STUN 서버는 인터넷의 복잡한 주소들 속에서 유일하게 자기 자신을 식별할 수 있는 정보를 반환해줌.
- 즉, webRTC 연결 시작하기 전에 STUN 서버로 요청을 보내면 서버는 NAT 뒤에 있는 peer들이 서로 연결할 수 있도록 공인 IP와 포트 찾아줌
- TURN: STUN 서버를 통해 자신의 주소를 찾지 못했을 경우 사용
- stun 서버를 사용하더라도 어떤 라우터들은 방화벽 정책을 달리하거나 이전에 연결된 적이 있는 네트워크만 연결할 수 있게 제한을 걸수도 있음
- turn 방식은 네트워크 미디어를 중개하는 서버를 이용함.
- 이는 중간에 서버를 한 번 거치기 때문에 엄밀히 말하면 p2p 통신이 아님.
- 구조상 지연이 필연적으로 발생함.
- webRTC는 아직 다양한 플랫폼에서 표준화가 완전히 구현되지는 않은 기술.
- 크로스 브라우징 이슈 해결하기 위해서는 adapter.js 라이브러리 함께 사용하는 것이 필수적
3-4. SDP
- session description protocol
- webRTC에서 스트리밍 미디어의 해상도나 형식, 코덱 등의 멀티미디어 컨텐츠의 초기 인수를 설명하기 위해 채택한 프로토콜
- ex) 비디오의 해상도, 오디오 전송 및 수신 여부
- 미디어와 관련된 초기 세팅 정보를 기술하는 sdp는 발행 구독 모델 (pub/sub)과 유사한 제안 응답 모델 (offer/answer)을 갖고 있음.
- 어떤 peer가 ~~이러한 미디어 스트림을 교환할 것이라고 제안하면 상대방으로부터 응답이 오기를 기다린다는 의미!
- pub/sub(발행-구독 모델) : 비동기 메시징 패러다임, 발행-구독 모델에서 발신자의 메시지는 특별한 수신자가 정해져 있지 않음. 대신 발행된 메시지는 정해진 범주에 따라 각 범주에 대한 구독을 신청한 수신자에게 전달됨. 수신자는 발행자에 대한 지식이 없어도 원하는 메시지만을 수신할 수 있다…!
- 응답을 받으면 각자 peer가 수집한 ICE 후보 중에서 최적의 경로를 결정하고 협상하는 프로세스가 발생함