개발일지

개요이제 Github Actions를 사용해 수정된 코드가 Github에 올라올 때마다 실서버에도 자동 반영할 수 있는 파이프라인을 구축해보자.  먼저 프로젝트의 .github/workflows 경로에 yml 파일을 생성한다. 다음과 같이 CI, CD flow를 독립적으로 관리할 것이다.project└── .github └── workflows ├── ci.yml └── cd.yml  Continuous Integration (CI)CI는 “지속적 통합”, 즉 개발자들이 코드 변경 사항을 주기적으로 중앙 저장소(Github)로 통합하는 프로세스를 의미한다. 자동화 된 빌드 및 테스트로 코드의 품질을 보장하고 혹시 모를 에러를 조기 발견할 수 있도록 도와준다.name: tes..

개요이번 시간에는 AWS Lightsail로 서버를 빠르게 배포하고 Github Actions으로 CI/CD까지 적용해보고자 한다. 처음 EC2로 서버 배포했을 때를 생각해보면 인스턴스 생성부터가 멘붕이었다. 설정 값 하나하나 모두 지정해줘야하는 것부터 시작해서 너무 복잡하고 어려웠다. Lightsail은 아마존에서 제공하는 가상 서버 서비스로 경량화된 EC2라고 생각하면 될 것 같다. 직접 사용해보면 알겠지만 대시보드를 통해 쉽고 간편하게 관리할 수 있고 EC2와 달리 별다른 설정 값이 필요없다. 따라서 규모가 크지 않고 부가 기능을 필요로하지 않는다면 Lightsail를 사용하는 것이 더 효율적일 수 있을 것이다.  Ligthsail 인스턴스 생성 및 프로젝트 배포하기Lightsail > Instan..

보호되어 있는 글입니다.

로컬에서 잘 돌아가던 웹소켓, 실제 서버에 배포 하면서 겪었던 삽질 모음..Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'getUserMedia') → 크롬에서 getUserMedia()는 보안된 출처(HTTPS 또는 localhost)에서만 동작 함. 참고)https://stackoverflow.com/questions/34215937/getusermedia-not-supported-in-chrome MediaSoupError: port bind failed due to address not available … createWebRtcTransport() listenIps 옵션 제대로 설정되어 있는 지 확인..

개요지금까지 구현한 SFU를 실제 EC2 서버에 배포해보자. 단발성 프로젝트로 하나의 EC2 인스턴스에서 FE, BE 전부 관리하고자 한다. 참고로 SFU 구현에는 mediasoup 라이브러리를 사용했으며, BE 서버는 오로지 웹소켓 통신을 위한 역할만을 한다. 경로 기반 라우팅 - Nginx현재 내부적으로 BE는 8000 포트, FE는 3000 포트를 사용하고 있다. 그러나 EC2는 하나이기 때문에 요청이 들어올 수 있는 입구도 하나일 것이다. 따라서 어떠한 기준에 따라 FE 또는 BE 포트로 적절히 연결시켜 줄 수 있어야한다. 기본 도메인, 즉 “http://ec2-domain.com”으로 요청이 들어왔을 땐 로컬 3000 포트(FE)로 연결해줬다. 그리고 “/socket.io” 경로로 들어온 요청은..

마지막 단계 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에서..