개발일지

마지막 단계 consume() 단계에서 막혀버렸다. produce, connect 하고 consumer까지 생성했는데 막상 클라이언트에는 비디오가 보이질 않았다. stream도 잘 생성됐고 router.canConsume() 결과 값도 true로 나오고 html 태그도 추가된 거 확인했는데 영상만 보이지 않는 믿기지않는 현상.. 결론적으로 createWebRtcTransport() listenIps 옵션 제대로 설정해주니까 정상적으로 보였다!// local에서 테스트할 경우const transport = await router.createWebRtcTransport({ listenIps: [ { ip: '127.0.0.1', announcedIp: null, }, ], ..

개요구현하고자 하는 화상 통신 프로젝트의 특징은 1:N 그리고 단방향 송출 이라는 것이다. 따라서 가장 적합하다고 생각하는 SFU 아키텍처를 선택했고 이제 이걸 어떻게 구현할 지 고민해봐야했다. SFU를 지원하는 라이브러리로 OpenVidu, Kurento, Mediasoup가 있었는데 그 중 Mediasoup를 선택했다. 이유는 가장 가벼우면서 공부하기에도 적합하다고 생각했기때문이다. OpenVidu와 Kurento는 구현이 쉽고 다양한 기능을 탑재하고 있긴 하지만 어차피 나는 기본 기능만 구현 하면 됐기 때문에 불필요하다고 생각했다.이번 시간에는 mediasoup 개념과 통신과정을 알아보고 이를 실제로 구현해보고자 한다. mediasoup 용어 정리Producer, Consumermediasoup에서..

개요 및 복습지난 시간 일반적인 웹소켓과 WebRTC 통신을 비교해보았다. 요약하자면 다음과 같다.WebRTC란 멀티미디어 및 스트리밍에 특화된 P2P 통신 기술이다.웹소켓은 브라우저 간 통신을 도와주는 중개 서버가 존재하지만, WebRTC는 브라우저끼리 통신 가능하다.대신 WebRTC는 초기 연결 수립을 위한 “시그널링 서버”가 필요하다.  WebSocketWebRTC이번 시간에는 시그널링 과정에 대해 알아보고 다양한 서버 구축 방식에 대해 알아보고자 한다. 기본적인 용어는 🔗[WebRTC] 개념 및 용어 정리 에 정리되어있으므로 생략하겠다. Signaling Transport 메커니즘?WebRTC에서는 별도의 transport 메커니즘을 제시하진 않는다. 참고로 Transport 메커니즘이란 시그널..

개요시그널링 서버 구현에 앞서 WebRTC 개념 이해하는데만 해도 한 세월이 걸렸다. 공식 문서를 읽는데 처음 보는 단어와 개념이 너무 많았고 그냥 지나치기에는 마치 영단어 모르고 영어 책 읽는 기분.. 어떤 건지 정도만 알아도 이해하는데 큰 도움이 될 거라 생각되어 간략하게 정리해보았다. WebSocket vs. Socket.io vs. WebRTC WebSocket양방향 통신을 위한 프로토콜이다. stateless, connectionless 한 HTTP와 달리 연결을 유지하여 서버와 클라이언트 간에 실시간 데이터 교환이 가능하다.“ws://example.com” 과 같은 형태의 url을 갖는다.Socket.io웹소켓을 기반으로 한 JS 라이브러리로 이벤트 기반 통신 등 추가적인 기능을 제공한다.웹소..

객체지향의 사실과 오해 : 네이버 도서네이버 도서 상세정보를 제공합니다.search.shopping.naver.com “객체지향” 하면 딱 떠오르는 개념들이 있다. 클래스, 캡슐화, 다형성 등 수도 없이 들어왔지만 정작 실제 구현할 때는 매칭이 잘 되질 않았다. “공통되는 것끼리 묶어 클래스로 만들고, 외부에서 몰라도 되는 건 캡슐화해라.” 그래 알겠는데 정작 어디까지가 공통의 범위인지 모르겠고, 객체지향이 확장성과 재사용성에 좋다는 건 알지만 실제 공감해 본 적은 없었다. 객체지향에 갓 입문한 사람들의 가장 흔한 실수는 협력이라는 문맥을 고려하지 않은 채 객체가 가져야할 상태와 행동부터 고민하기 시작한다는 것이다. (p.109) 객체지향 입문자들이 데이터나 클래스를 중심으로 애플리케이션을 설계하는..

프로세스 (Process)프로세스는 “실행 중인 프로그램”이라고 불린다. 프로그램은 무엇일까? 우리가 사용하는 카카오톡, 크롬, 워드 모두를 프로그램이라고 볼 수 있다. 우리는 카카오톡을 사용하기위해 바탕화면에 있는 아이콘을 더블클릭하여 실행시킬 것이다. 이때 카카오톡 그 자체를 프로그램, 더블클릭하여 실행된 상태를 프로세스라고 볼 수 있다. 다시말해 프로그램은 하드디스크에 존재하다가 실행 시키는 순간 메모리로 적재되고 “프로그램이 메모리에 적재된 상태”를 프로세스라고 부른다.작업 관리자에 들어가면 프로세스를 직접 확인해볼 수 있다. 보통 프로세스 하나만 실행시키는 사람은 없을 것이다. 인터넷도 하다가 카카오톡도 하다가 동시에 음악을 듣기도 한다. “동시에”라고 표현하기는 했지만 실제 동시에 실행되는 것..

개요프로세스 메모리 영역은 크게 코드 영역, 데이터 영역, 스택 영역, 힙 영역으로 구성된다. 그중 힙 영역은 동적 할당된 메모리를 관리하는 영역으로 사용자가 명시적으로 메모리를 할당하고 해제 해야한다. 반환하지 않을 경우 메모리 누수와 같은 문제가 발생할 수 있다. 그러나 Node.js는 가비지 컬렉션 기능을 제공하므로 메모리를 수동으로 관리하지 않아도 된다. 그렇다면 이 가비지 컬렉션이란 무엇일까?  가비지 컬렉션 (Garbage Collection)가비지 컬렉션(GC)이란 동적 할당된 메모리에서 더 이상 사용되지않는 객체를 자동으로 식별하고 해제하는 기법이다. 본론에 들어가기 전에 GC 알고리즘으로 어떤 것들이 있는지 알아보자. GC 알고리즘으로는 크게 참조 횟수 계산 방식(Reference cou..