수피의 느슨한 개발

Origin 요청과 Edge location 요청 간 응답시간 비교 S3를 cloudfront로 배포했을 때 응답 시간 감소의 효과가 얼마나 좋은건지 직접 확인해 보고 싶었다. 라이브 스트리밍 프로젝트를 진행하면서 동일한 ts파일에 대한 GET 요청을 보냈을 경우 cloudfront에 배포할 때와 단순히 Origin(S3)에서 GET 요청을 보낼 때의 차이를 비교하는 방식으로 테스트를 진행하고자 했다. 그래서 Chrome의 inspector창을 열어 '네트워크'의 '타이밍' 항목을 통해 응답 대기 시간을 비교해 보았다. 방식은 간단하다. 다시보기 서비스 이용을 통해 cloudfront의 캐시 정책을 no-cache로 설정하여 전혀 캐싱을 하지 않을 때와 Elemental-MediaPackage 캐시 정책..

Nest.js passport로 카카오, 구글 로그인 인증 구현하기 passport를 통해 카카오, 구글 계정으로 로그인할 수 있도록 구현하면 유저 입장에서는 회원가입 절차 없이 바로 로그인 가능하기 때문에 편의성을 제공해 줄 수 있게 되고, 무엇보다 소셜 로그인 정보를 기반으로 유저에게 특별한 회원가입 절차 요청 없이 회원 가입 처리가 가능해진다. 아래 링크에 접속하면 카카오에서 로그인 인증을 어떤 과정으로 처리하는지에 대한 설명이 담겨 있으니 관심있으면 참고해보자. 카카오 로그인 처리 Flow 간략하게 소셜 로그인 인증과정을 정리하자면 아래와 같다. 사용자가 사이트(이하 프론트)에서 카카오 로그인 버튼을 클릭합니다. 백엔드는 카카오 인증 서버에게 인가 코드 발급을 요청합니다. 카카오 인증 서버에서 사..

라이브 스트리밍 프로젝트를 진행하면서 요즘 유행하는 버튜버 기능을 구현하고자 시도해 보았다. 실제 버튜버 적용을 어떻게 하는지 알아본 바에 따르면 Vroid studio라는 프로그램으로 버튜버 캐릭터를 생성 및 저장할 수 있으며 (.vrm 파일로 생성된다.) 이를 animaze 라는 소프트웨어를 통해 캐릭터를 불러오면 웹캠에 비춰진 내 모션과 캐릭터가 연동되어 움직이는 연출이 즉시 적용되었고, 해당 화면을 OBS에서 가상 카메라 형태로 송출하는 방식임을 알 수 있었다. 이처럼 단순하게는 ZOOM의 아바타 기능에서 더 나아가 버튜버처럼 최소 눈과 입 모션 캡처를 적용하는 방법은 어디서부터 어떻게 구현해야할지 당장 떠오르지 않았다. 하지만 당장 시도해볼 만한 방법은 face detection을 통해 카메라에..