Audio.duration возвращает infinity, почему?

Question

[mirikkingg]

При этом currentTime работает корректно. А вот duration работать не хочет, что не так? При этом если песня на сервере полностью проигралась - duration возвращается правильно.

<audio src="123.mp3" data-musicid="0" class="track_audio"></audio>

$('.track_audio').trigger('load');
    var audio = document.querySelector('.track_audio');
    
    const updateProgress = function (e) {
        console.log(e.target.currentTime);
        console.log(e.target.duration);
    }
    
    
    audio.addEventListener('timeupdate', updateProgress)
    
    console.log(audio.duration)

Answer 1

[Александр Шипин]

A double-precision floating-point value indicating the duration of the media in seconds. If no media data is available, the value NaN is returned. If the element's media doesn't have a known duration—such as for live media streams—the value of duration is +Infinity.

Мат часть

Говоря другим языком, ваш код думает, что элемент ещё не загружен (загружается в процессе), необходимо добавить Listener, как пример:

audioPlayer.addEventListener('loadedmetadata', function () {
    if (audioPlayer.duration == Infinity) {
        audioPlayer.currentTime = 1e101;
        audioPlayer.ontimeupdate = () => {
            this.ontimeupdate = () => {
                return;
            }
            vid.currentTime = 0;
            return;
        }
    }
});

Comments

[mirikkingg]

$('.track_audio').trigger('load'); этот тригер не заставляет принудительно загрузить аудио?

Благодарю, все работает как вы и написали.