프런트엔드 영역에서 FileReader를 이용해 MP4 파일 내 오디오 존재 여부 확인하기

문제 상황

• LINE VOOM 웹에서 MP4 파일의 오디오 존재 여부를 빠르게 판별해야 하는 요구
• 모바일 웹 환경을 고려해 전체 파일이 아닌 필요한 데이터만 요청해야 하는 제약

원인 분석

• 브라우저별 오디오 판별 API가 제각각이라 일관된 구현이 어려움
• Chrome API는 정확도 문제, Safari와 Firefox는 서로 다른 API 이름 사용
• MP4 내부 구조를 보면 오디오 정보가 hdlr 아톰의 soun 값으로 표시됨

해결 방법

• MP4를 BLOB으로 받아 Range 헤더로 일부 구간만 요청
• FileReader로 바이너리를 문자열로 변환해 hdlr...soun 패턴 포함 여부 확인
• 응답에 없으면 더 뒤 구간을 추가 요청하며 순차적으로 판별

성능/운영 포인트

• 파일 크기에 따라 soun 위치가 뒤로 갈 수 있어 요청 범위를 단계적으로 확장
• 데이터 사용량과 요청 횟수를 줄이기 위해 threshold 배열을 사전 정의
• iOS 15 계열에서 Range 관련 CORS 이슈가 있어 브라우저 버전 차이를 확인