본문 바로가기
반응형

프로그래밍/JavaScript7

지니, 멜론, 플로 웹버전 실시간 차트에서 듣기 싫은 가수 제외하기 음원 사이트에서 실시간 차트로 쭉 음악을 가져오려다 보면 몇몇 가수들이 스트리밍으로 쭉 차트에 줄 세우기를 해 놓아서 불편할 때가 있다. 요즘은 이러한 일로 인한 불만이 거세서 앱에서는 다 원치 않는 아티스트를 차단할 수 있는 기능이 있는걸로 아는데, 웹 버전은 이런 기능에 소홀한 편이라 직접 만들었다. 다만 나는 이제 유튜브 프리미엄으로 넘어가서 쓸 일이 없지만.. 작년에 개발해놓고 귀찮아서 배포를 미루고 미루다가 구글에 5불 낸 것이 아까워서 지금이라도 배포했다. 스트리밍 서비스 아티스트 제외기 (google.com) 위 스토어에 올라간 예시 스크린샷의 원본이다. 무조건 1280x800으로 내라길래 이리저리 축소하고 크롭하느라 고생했다. 사용법은 특별한 것이 없다. 그냥 아티스트명에 제외를 원하는 이.. 2024. 3. 1.
JS에서 RSA 이용하기(키 페어 생성/암호화) - Web Crypto API 국내에서는 거의 정보가 없어서 올려본다. 종단간 암호화 채팅 서비스를 만들어보려고 프론트엔드에서 RSA 암호화를 할 방법이 없나 알아보았는데 암호화 자체는 가능하지만 RSA 키 페어를 생성할 방법이 마땅치가 않았다. 백엔드에서 RSA 키 페어를 생성해주면 종단간 암호화는 아무런 의미가 없기 때문이다. 그래서 방법을 알아보다가 거의 유일하게 발견한 방법이 이 API였다. 브라우저에서 지원하는 API라서 신뢰하고 써도 될 것이다. SubtleCrypto에 대한 자세한 정보는 MDN에 나와 있으므로 참고해도 좋다. 이 API가 지원하는 RSA 체계는 다음과 같다. RSA-OAEP (암호화) RSASSA-PKCS1-v1_5 (전자서명) RSA-PSS (전자서명) 1. Key Pair 생성 이 API를 이용하는 .. 2022. 4. 29.
Express에서 Multer로 파일 처리하기 웹 서비스를 운영하다 보면 사용자가 업로드한 파일을 처리해야 할 일이 반드시 생간다. 다만 파일같은 경우에는 용량이나 파일의 종류 등 제한하고 싶은 점이 많을 것이다. 오늘은 Express에서 multer를 통해 파일을 처리하는 법을 알아보자. Multer multer는 Express를 위해 개발된 파일 처리 미들웨어이다. 파일을 업로드받을 때 해야 할 귀찮은 일들을 대신 처리해 준다고 보면 된다. 설치는 간단하다. npm i multer 구조 일단 프로젝트 구조부터 보자. 익스프레스는 워낙 자유도가 높은 프레임워크라 쓰기 나름이지만, 그래도 어느 정도는 표준적인 구조는 존재한다. 나같은 경우에는 다름과 같은 구조로 프로젝트를 구성한다. └project └constants └error.js └contro.. 2021. 12. 20.
화면 녹화 웹사이트 공유 - onvid.net 홍보라고 생각하면, 맞다. 내가 만든 웹사이트다. WebRTC와 ffmpeg.wasm과 한 2주간 씨름을 하며 만든 서비스다. 사실은 아직도 안정적이라고 할 수는 없다. 간단하게 짧은 영상을 녹화하는데 적합할 것이다. 내가 밑바닥부터 전부 만든 사이트기도 한데, 배경이나 로고도 전부 직접 디자인했다. 글래스모피즘이라는게 맘에 들어서 써봤는데 잘 된건지는 모르겠다. 라이브러리는 리액트를 활용했다. 백엔드는 없고, 모든 것이 프론트에서 처리된다. 호스팅은 Netlify에서 제공하는 무료 요금제를 이용했다. 어차피 그 트래픽 다 쓸 정도로 사용자가 많지도 않아서 상관없다. 이용 방식은 간단하다. 저기서 본인이 원하는 옵션을 선택해서 Record Now 누르면 녹화된다. 웹캠도 넣어놓긴 했는데, 쓸 사람은 없을.. 2021. 10. 29.
반응형