개발일지 (17) 썸네일형 리스트형 접근 제어 부분 리팩토링 시작하기에 앞서 프로젝트를 진행하는데 있어 접근 제어에 대한 부분을 Spring Security를 이용해 구현했다. 어떤 부분에 대해 제어가 필요했는지에 관해 먼저 알아보자. 먼저, 기본적인 처리부터 알아보자. 정규 회원의 정보 수정은 웹 관리자 혹은 자기 자신만 가능하다. 정규 회원의 회원 탈퇴는 웹 관리자 혹은 자기 자신만 가능하다. 이 부분에 대한 처리는 어느 웹 서비스에서도 동일하게 적용될 것이다. 우리 서비스에서는 스터디에 대한 서비스를 추가적으로 제공한다. 이 부분에 대해서 추가적인 요구사항이 발생하게 된다. (C - 생성, R - 조회, U - 수정, D - 삭제) 스터디 내부를 들어가는 것은 오직 스터디 회원만 가능하다. 스터디 내부에 추가적인 게시판을 만드는 것은 웹 관리자 혹은 스터디 .. [WebRTC] Janus를 활용해 화상회의 만들기(React편, 동작 결과물) - (2) 시작하기 전에 앞서 이전 포스트에서 Janus를 Javascript 모듈로 제공한다고 언급한 적이 있으며 이에 대한 사용 방법을 Documentation으로 제공한다고 언급한 바 있습니다. 이번 포스트에서는 Documentation에서 제공하는 내용들을 학습했다는 가정 하에 설명하기 때문에 자세한 설명이 존재하지 않을 수 있습니다. (도중 이해가 안가시는 부분이 존재하신다면 [WebRTC] Janus REST API 활용법 (tistory.com) 포스트로 이동해 정리된 노션을 확인하시거나 공식 Janus Documentation을 통해 확인하실 수 있습니다.) 그리고 기존에 진행 중이던 React 프로젝트를 토대로 설명하기에 프로젝트의 설정부터 진행하지 않는다는 부분을 알아주셨으면 좋겠습니다. 그리고 .. [WebRTC] Janus를 활용해 화상회의 만들기(Spring편) - (1) 요구사항 실제로 화상회의를 구현하기 전에 요구사항을 명확히 하려고 했다. 화상회의에서 요구되는 사항은 다음과 같다. 스터디 회원은 누구든지 화상회의 방을 생성할 수 있다. 생성된 화상회의는 스터디에 종속적이고 스터디에 속해있지 않은 회원이 조회할 수 없다. 생성된 화상회의는 웹 관리자, 스터디 관리자, 회원만이 수정 및 삭제할 수 있다. 이를 간단하게 그림으로 표현하면 다음과 같다. 현재 우리 서비스에는 백엔드 스터디와 프론트엔드 스터디가 존재한다. 백엔드 스터디에는 A라는 사람이 참여 중이고 프론트엔드 스터디에는 B라는 사람이 참여하고 있다. 이 상황에서 백엔드 스터디에 가입한 A라는 사람은 백엔드 스터디에 존재하는 모든 방에 모두 들어갈 수 있다. (비밀번호가 없는 방이라고 가정) 마찬가지로 프론트엔.. [WebRTC] Janus REST API 활용법 Janus REST API 이전 포스트에서 언급했듯이 Janus를 사용하는 방법은 다양하다. REST API WebSocket MQTT RabbitMQ 나는 이 중에서 REST API를 통해 Janus와 통신하는 방식을 선택했다. 이에 대한 Document는 Jauns 공식 홈페이지에 잘 나와있다. (Janus HomePage) 여기서 Documentation 메뉴에서 Related Pages를 살펴보면 다양한 Documentation들을 확인할 수 있다. 여기서 실제로 활용하는데 필요한 Documentation들을 읽었다. JavaScript API - 실제 Janus를 사용하기 위해 Janus를 JS에서 사용하는 방식 Using janus.js as JavaScript module - janus.js.. [WebRTC] Janus란 (동작, 설치, Demo 서비스) Janus란? Janus란 미디어 서버를 사용할 수 있게 구성한 오픈 소스이다. Janus는 어떤 방식으로 우리에게 서비스를 제공하는지 자세히 알아보자. Janus에 관한 동작 방식은 다음 유튜브 링크에서 잘 설명되어져 있다. Janus: The Server-side WebRTC Jack of All Trades - WebRTC Rockstars Asian Tour - SingaporeJS - YouTube 여기서 설명하는 구조에 대해 간단하게 알아보자면 다음과 같다. 위의 그림에서와 같이 Janus는 WebRTC 기능을 제공하는 Core 부분과 실제 어플리케이션 기능을 제공해주는 Plugin으로 나누어져 있다. 여기서 어플리케이션 기능을 제공해주는 Plugin이란 다음과 같다. Streaming Plu.. [Junit5] Static Method Mocking Junit5 Static Method Mocking 회원가입을 진행하는데 있어 가입 인증 메일을 통해 검증을 진행했다. 이메일을 사용하는 곳은 단순 가입 인증 메일만이 아니다. 비밀번호 변경을 진행하는데 있어서도 비밀번호 변경 메일을 통해 검증을 진행하고 비밀번호 변경을 진행할 수 있도록 구현했다. 이메일은 JavaMailSender를 통해 보내도록하였고 Html 전송을 위해 MimeMessage를 생성하여 이를 처리할 수 있도록 하였다. (이메일 전송에 관해 자세하게 다루는 포스트가 아니므로 생략하겠습니다.) 이에 대한 로직을 실제로 테스트해보기 위해 작성해둔 Unit 테스트를 돌려보았는데 제대로된 Mocking이 되지 않고 Null Object로 남아있는 모습을 확인할 수 있었다. 이메일의 내용에.. [WebRTC] WebRTC의 다양한 방식들 (Mesh, SFU, MCU) P2P(Mesh) 이전 포스트에서 설명했던 P2P 방식이다. 클라이언트 즉, Peer 간의 연결을 진행하기 때문에 서버는 단순 연결을 위한 정보를 중계할 때만 사용된다. 위의 그림에서처럼 클라이언트마다 자신의 미디어 정보를 송신할 링크(Uplink) 1개와 미디어 정보를 수신할 링크(Downlink) 1개를 가지게 된다. 만약, 위의 그림처럼 5명의 클라이언트가 각각에 대해 Peer Connection을 맺는다면 각 클라이언트는 나머지 4명의 클라이언트에게 자신의 미디어 정보를 송신할 링크(Uplink) 4개와 4명의 클라이언트로부터 미디어 정보를 수신할 링크(Downlink) 4개를 가져 총 8개의 링크를 가지게 된다. (인원이 많아질수록 링크 개수는 기하급수적으로 늘어난다.) 장점 클라이언트끼리 .. [Web RTC] Web RTC란? Web RTC를 도입하려고 한 이유 스터디를 진행하면서 꼭 필요한건 바로 화상회의가 아닌가 싶다. 나는 스터디 웹을 개발하는 도중 위와 같은 요구사항을 만족하기 위해 화상회의 개발을 위해 공부를 진행했고 이를 위해 WebRTC를 도입해야겠다고 생각했다. 이를 위해 WebRTC에 대해 알아야했고 공부했던 내용을 정리하고 공유하고자 한다. Web RTC란? Web RTC란, Web Real-Time Communication의 약자이며 JS API로 위와 같은 기능들을 제공해주는 오픈소스일뿐이고 우리가 직접 구현해야 한다. 먼저, Web RTC에 대해 간단히 살펴보자. Web RTC를 간단히 번역해보자면 웹 실시간 통신이라는 것을 쉽게 알 수 있는데 이 말에서 의미하는 바와 같이 웹, 앱에서 비디오, 마이.. 이전 1 2 3 다음
