0

I try to get duration from audio tag. My code get Audio file from server with axios, and it puts on audio tag. That code like that.

//Parents Component
 const [sound, setSound] = useState({
 url: "",
 timestamp: {},
 });

...

//Child get sound from Parents Component by props.
//That's worked well, and playing file worked well too.
{/* Playing sound Tag */}
 <audio
 ref={audioRef}
 src={sound.url}
 onLoadedData={loadedData}
 onTimeUpdate={getCurrentDuration}
 preload="metadata"
 ></audio>

and Problem in here.

//#region 진행 시간, 퍼센트 구하는 함수
 const getCurrentDuration = (e) => {
 if (e.currentTarget) {
 const currentTime = e.currentTarget.currentTime;
 /* Return current audio bar's length to seconds

    -> This point occurs problem. Duration return to NaN
    NaN occurs when there is no data, but when I checked it with the console
    Even though it is executed after carrying sound, NaN occurs
 */
 const duration = e.currentTarget.duration;

 const percent = ((currentTime / duration) * 100).toFixed(2);
 console.log(e.currentTarget)
 setPercentage(+percent);

 setCurrectTime(currentTime.toFixed(2));
 }
 };
C12H22O12
  • 51
  • 2
  • 7

0 Answers0