olrlobt

[WebRTC] WebRTC 참고 사이트 본문

else/WebRTC

[WebRTC] WebRTC 참고 사이트

olrlobt 2023. 1. 3. 00:17

* WebRTC에 관한 공부를 하며 정리한 글로, 부정확한 개념 정리가 있을 수 있습니다.

* WebRTC에 관한 깊은 정리가 아닌, 간단히 구현을 해보고자 하는 개발자분에게 도움이 되려 글을 작성했습니다.

 

 

WebRTC는 오픈된 정보가 많지 않기때문에 개발에 어려움을 느끼는 분들이 많을 것 같아,

유용했던 사이트를 공유하려한다.

 

 

 

Google Developers Codelabs - 

https://codelabs.developers.google.com/codelabs/webrtc-web?hl=en#0

 

Real time communication with WebRTC  |  Google Codelabs

Learn how to stream media and data between two browsers. Get to grips with the core APIs and technologies of WebRTC. Capture and manipulate images using getUserMedia, CSS, and the canvas element. Set up a peer connection and exchange data directly between

codelabs.developers.google.com

Google Developers Codelabs에서 제공하는 WebRTC 예제 문서이다. 모두 영문으로 표기되어 있으며, 코드에 대한 간단한 설명과 Github를 통한 6단계의 예제를 제공한다. 무작정 따라하는 것 만으로도 webRTC를 체험해 볼 수 있지만, 초보 개발자가 이해하기에는 다소 어려운 문서라 생각한다.

 

 

 

 

WebRTC experiment (Muaz Khan) -

https://www.webrtc-experiment.com/

 

WebRTC Demos, Experiments, Libraries, Examples | Muaz Khan

WebRTC Demos, Experiments, Libraries, Examples | Muaz Khan WebRTC Demos, Experiments, Libraries, Examples Github: https://github.com/muaz-khan/WebRTC-Experiment RecordRTC | WebRTC Audio+Video+Screen Recording WebRTC JavaScript library for audio/video a

www.webrtc-experiment.com

Muaz Khan이라는 개발자 분의 WebRTC에 관한 문서이다.

 

제공되는 오픈소스로 간단히 WebRTC를 구현해 볼 수 있고, 아래 사진들과 같이 체험해 볼 수 있는 데모 버전도 제공해준다. 단점이라면, 한 파일에 너무 많은 기능이 존재하다보니, 내가 원하는 기능만 뽑아내려면 많은 노력을 들여야 한다.

 

 

 

대시보드 + 화상채팅 + 채팅 + 파일공유 예제
비디오 스트리밍 예제

 

 

 

나는 위 사이트를 이용하여, webRTC를 활용한 비디오 스트리밍 서비스를 간단히 구현해 보았다. 

다만, Muaz Khan에서 제공되는 Signaling 서버를 이용하게되면, Muaz Khan이 다운되는 순간 이용이 불가능 하게 된다. 따라서, 일반적인 코드 참조만 하고, Signaling 서버는 따로 구현하는 것을 권장한다.

 

 

 

 

'else > WebRTC' 카테고리의 다른 글

[WebRTC] WebRTC 통신방식 & 용어 정리  (0) 2023.01.01
Comments