[ WebRTC ] 1일차 - 기초지식 주입중 ...
최대한 알기 쉽게 요약 !
- WebRTC를 통해 화상통화 + 채팅 + 게임 + 파일전송등을 손쉽게 할 수 있음.
- 대표적인 예 카톡영상통신, 행아웃 등 생각하면 됨
- P2P(개인간 통신)이 기본이지만 쫌 머리쓰면 다자 통신도 가능(서버 추가구성 필요)
1. WebRTC 미리보기
1.1 기본 체계
WebRTC 를 통해 다른 웹 브라우저에 P2P(개인간) 연결을 손쉽고 빠르게 할 수 있습니다. 일반적으로 통신을 배우려 한다면 NAT, 데이터손실, 연결 끊기 등 다양한 문제를 처리해야 되는데 WebRTC를 사용하면 이런 기능을 브라우져에서 기본적으로 제공하게 됩니다.
WebRTC API는 미디어 캡춰, 음성 및 영상의 인/디코딩 처리, 전송/세션 레이어관리를 지원합니다.
- 미디어 캡춰 : 사용자의 카메라와 마이크 권한 획득 후 스트림 처리
- 음성 및 영상의 인/디코딩 처리 : 영상을 프레임단위로, 음성을 작은 단위로 나눠 압축/복원 하는 코덱 지원(H.264, iSAC, Ipus, VP8 등)
- 전송 레이어 : 패킷 교환, 정렬, 손실 및 다른 유저에게 접속하는 것을 WebRTC API를 통해 손쉽게 관리
- 세션 관리 : 접속 관리, 연결, 조직화 등을 관리(signaling 이라 부름)하며 RTCDataChannel API를 통해 처리
1.2 WebRTC의 활용
- 실시간 마켓팅
- 실시간 광고
- 백오피스 통신(CRM, ERP, SCM, FFM)
- 채용 괸리
- 소셜 네트워킹
- 데이팅 서비스
- 온라인 의료 상담
- 금융 서비스
- 감시
- 멀티 게임
- 실시간 방송
- 이러닝
2. WebRTC 아키텍처
복잡함
여러 구성이 있긴 하지만 (개인 - 서버 - 개인 형태로 연결) 이구성을 통해 개발해보기로 함. (중간에 ICE + STUN / TURN은 일단 배제)
접속 => 연결관리(세션관리, 응답, 스트리밍관리, ICE 후보관리) => 이벤트 처리
2.1 RTCPeerConnection
- WebRTC API의 진입점
- 개인간 연결 초기화할 때 유용
2.2 MediaStream
- getUserMedia API
- 음성 및 영상 스트림에 접속권한 부여
- 사용자 기기(카메라, 마이크) 선택 정보 관리
- 스트림(영상,음성) 전송 중 보안레벨 지원
2.3 RTCDataChannel
- 개인간의 미디어 스트림 전송 채널 관리
2.4 요약
- RTCPeerConnection : 접속 관리
- MediaStream : 사용자 기기관리 및 보안
- RTCDataChannel : 데이터 처리, 채널링
3. 환경구성
3.1 정적 웹서버 설치
- nodejs 설치
- node-static 설치
sudo npm install -g node-static - 실행
static명령어가 실행된 기준 해당 디렉토리가 static 하게 웹호스팅 된다
3.2 WebRTC 프로토콜
실시간 데이터 통신은 두 사용자간 빠른 속도로 대화하는 것이다. 고품질 유지를 위해서는 초당 약 30~60회 음성/영상 데이터가 교환이 필요하다. 그래서 중요한건 최신 데이터(프레임)를 상대에게 보내는 것이 중요
3.3 라우팅 기술
- STUN (Session Traversal Utilities for NAT) : 세션 순회 유틸
STUN 서버를 통해 사용자 식별(IP정보) 후 사용자 간의 연결을 도움.
실운영(production) 환경에서는 자체 STUN 및 TURN을 배포해야합니다.
- TURN (Traversal Using Relays around NAT) : 릴레이를 사용한 순회
STUN 을 허용하지 않는 네트워크에서는 TURN을 활용하여 사용자 식별
하지만, 왠만한 곳에서 TURN 없이 STUN 으로만 사용자 식별이 가능함.
- ICE (Interactive Connectivity Establishment) : 대화 형 연결 설정
ICE는 STUN 서버를 사용하여(연결 실패 시 TURN 사용) 연결된 사용자정보를 클아이언트 응용 프로그램에 알린 후 연결을 설정합니다.
3.4 데이터 전송
WebRTC에서는 SCTP 프로토콜을 통해 DataChannel 개체로 감싸서 데이터를 보내는 API를 제공합니다. (SCTP 프로토콜 : UDP의 높은 성능과 신뢰성이 포함된 프로토콜)
대단하네요. 👍👍👍
응원 감사합니다 ~~
Get Automated DAILY upvotes! FREE
steem.link/more
Get 0.1 Free Steem Just To Join
개발자 존경 함.😊
응원 감사요 ^^
화이팅!!
스팀시티 이벤트 보팅(20-4)입니다.
우왓...사진 조으다.ㅋㅋ
아자~아자~아자~퐈이야~!
'스파'시바(Спасибо스빠씨-바)~!
기존의 시스템과.. WebRTC 방식의 큰 차이점이 있을까요?
예를 들면 Webex 같은 경우에 상당히 안정적인 기능을 제공 하고 있는데
(어떤걸로 개발된지는 모르지만...) WebRTC 방식에 의해 고 품질의 시스템이 보다 많이 공급 될 수 있다 라고 생각 하면 될까요 ㅎ?
그래도 이렇게 API로 제공해주니 참 좋긴 하네요 ㅎ
Webex => 시스코에서 만든 비디오컨퍼런스 콜 , WebRTC => 통신 표준을 만든것
간단하게 이야기 하면 이런 거죠...
그리고 어찌 되었건 통신이라는 것이 생각해보면 프로토콜 기반으로 해서 안정적으로 데이터를 전송하는 것인데 ... 시스코 같은 경우 네트워크 분야에 오래 있으면서 기술력을 축적하여 만든 솔루션(webex)이고
WebRTC는 그런 통신 규약을 개인이 만들면 힘드니 통신 interface를 표준화 및 압축기술(encoding/decoding) 등 다양한 기술을 함축하여 API로 만들어 제공하는 것이죠...
그춍 ㅋㅋ
제가 궁금한거는,,, 새로운 개발 방식이 나온거 같아서
기존의 시스템들하고 얼마나 차이가 있을까 궁금해서 여쭤본거에요 ㅎ
제가 webex/skype/nateon/다 사용해봤는데 webex에서 제공하는게 최고더라고요
webex 에서는 WebRTC 방식을 사용을 안했을 것 같은데.
WebRTC는 방식으로 새로운 비디오 컨퍼런스 콜이 개발이 되면
현재 시스템의 강자인 webex와 어느정도 비교할 수 있을까가 궁금했어요 ㅎ
WebRTC가 높은 품질을 제공한다면, 기존의 개발되었던 영상/음성 처리 프로그램들이 왠만하면 재개발 들어가야 하는거잖아요 ㅎ
안써봐서 기능까지는 잘 모르겠지만... https://appr.tc/ 사이트가서 함 체험 해보시면 아시겠지만
1:1 통화에서는 전혀 문제가 없네요 끊김도 거의 없고 ㅋ
솔루션이라 (돈내고쓰니깐) 편하지만 , 커스터마이징과 opensource라는 강점이 있기 때문에 WebRTC가 좋긴합니다.
참고로 카톡 아마 webrtc쓸꺼에요
오오,
좋네요 그럼, 보통 인터넷이 빠른곳에서는 별 차이가 안나는데 ㅋ
인터넷 환경이 안 좋은 곳에서도 그나마 강한게 웹엑스랑 카톡인데,
저 기술로 인해 해당 산업도 판도가 뒤집힐 수 있겠네요 굿굿 감사합니다.!!
잘봤습니다. WebRTC 시리즈물을 연재하시는것 같군요 ~!
넵, 배워가면서 기록물로 남기려 하네요 ^^
파이어폭스가 브라우저에 메신저를 내장했던데 WebRTC를 쓰나보네요.
그건 저도 잘 ... ㅋ 크롬만 써서요 ㅜㅜ
모질라 제단이라 아마 WebRTC를 사용하긴 할 것 같아요
웹브라우저와 서버간 레이어가 많아져서 풍성해지는데 뭔가가 어렵네요.
네 뭔가 어려워지기는 ... 하지만 누군가 만들어 주니까요 ㅋ
어렵네용.ㅋㅋㅋㅋ
WebRTC를 사용하는것중에 https://appear.in/ 이것도 있죠.ㅋㅋ