
동영상 파일을 재생하기 전에 재생시간을 미리 구하는 방법
// 업로드 파일 가져오기
const files = useFileList(); // files의 type은 File[] 형식이다
const getDurations = async () => {
// files 배열의 각 파일에 대해 Promise.all로 비동기 처리
const durations = await Promise.all(
files.map(
(file) =>
new Promise<number>((resolve) => {
// 파일이 비디오인 경우
if (file.type.startsWith("video/")) {
// video 엘리먼트 생성
const video = document.createElement("video");
// 파일 URL을 video의 src로 설정
video.src = URL.createObjectURL(file);
// 비디오의 metadata를 로드하는 이벤트 리스너
video.addEventListener("loadedmetadata", () => {
resolve(Math.floor(video.duration)); // duration을 resolve
URL.revokeObjectURL(video.src); // URL 해제
}, { once: true });
} else {
// 파일이 비디오가 아닌 경우 0을 resolve
resolve(0);
}
})
)
);
return durations
};
출력화면
