Develop/AI1 블러 알고리즘 웹 기반 실시간 스트리밍 영상 처리 시스템을 개발하는 과정에서 개인정보 보호에 관한 이슈 사항이 있었다.특히 실시간 CCTV 영상에서 스냅샷 기능을 사용할 경우 사람의 얼굴, 차량 번호판, 특정 문구 등 식별 가능한 개인정보가 포함될 수 있어 이를 자동으로 마스킹 처리해야 하는 요구가 있었다.일반적인 CSS의 filter: blur() 속성은 DOM 요소에만 적용이 가능하기 때문에 현재 Canvas 픽셀 데이터는 직접 제어가 불가능했다.또한 외부 라이브러리 사용시 번들 크기가 증가하고 의존성 관리도 부담스러웠다.(실시간 처리가 필요하기 때문에 성능 이슈 발생) 그래서 Canvas API의 ImageData를 직접 조작하여, 순수 JavaScript/TypeScript로 블러 알고리즘을 구현했다. Box.. 2025. 11. 4. 이전 1 다음