AI Briefing

HEIC 파일 포맷 지원으로 사용자 경험 개선하기

·2024.04.01 13:59

확장자 대신 파일 시그니처로 HEIC를 감지해 변환·업로드를 지원한다.

iPhone이나 Android에서 촬영한 사진은 .jpg처럼 보여도 실제 파일 타입이 image/heic인 경우가 있다. 원티드 소셜은 image/jpegimage/png만 지원하고 있었기 때문에, 확장자만 믿고 업로드를 처리하면 에러가 발생했다.

이 문제를 풀기 위해서는 파일의 실제 타입을 확인해야 한다. 바이너리 파일은 헤더에 형식 정보를 담고 있으며, 이때 쓰는 것이 파일 시그니처다. 예시로 od 명령어로 HEIC 파일을 확인하면 헤더에 ftypheic 같은 값이 보이고, 이를 기준으로 heic/heif 여부를 판별할 수 있다.

웹에서는 FileReader로 파일을 Uint8Array로 읽은 뒤, 4~12바이트 구간을 문자열로 변환해 HEIC 시그니처 목록과 비교하면 된다. 코드에서는 ftypmif1, ftypmsf1, ftypheic, ftypheix, ftyphevc, ftyphevx를 검사해 HEIC 형식을 감지한다.

브라우저가 HEIC/HEIF를 직접 지원하지 않는 경우가 많기 때문에, 업로드 전에 JPEG나 PNG로 변환하는 흐름이 필요하다. 이때는 직접 구현하기보다 heic2any 같은 검증된 라이브러리를 사용하는 편이 효율적이며, 예시 코드에서는 HEIC 파일을 image/jpeg로 변환한 뒤 quality: 0.8로 새 File 객체를 만들어 반환한다.

다른 플랫폼들도 이미 이 포맷을 받아들이고 있다. Jira, Confluence, Slack은 HEIC 업로드를 지원하며, Slack은 화면에는 PNG처럼 보여도 다운로드하면 원본 HEIC가 내려오는 방식으로 처리한다.

핵심은 사용자가 올린 파일의 확장자명만 보고 판단하면 안 된다는 점이다. 업로드 기능에서는 실제 파일 타입을 시그니처로 확인하고, 필요하면 변환까지 포함해야 HEIC 사용자 경험을 자연스럽게 개선할 수 있다.

이 요약은 원문 이해를 돕기 위한 큐레이션입니다. 저작권은 원저작자에게 있으며, 정확한 내용과 맥락은 원문을 확인하세요.

요약 오류, 출처 표기 문제, 삭제 요청은 문의 · 건의로 알려주세요.