AudioBuffer.duration — Eigenschaft · JavaScript-Referenz

Signatur

AudioBuffer.duration

Beschreibung

Die schreibgeschützte Eigenschaft duration eines AudioBuffer gibt an, wie lange die im Puffer enthaltenen PCM-Audiodaten in Sekunden sind. Der Wert wird intern aus zwei anderen Eigenschaften berechnet: length / sampleRate, also Anzahl der Sample-Frames pro Kanal geteilt durch die Abtastrate.

Typische Einsatzgebiete sind die Anzeige der Spieldauer in einem Audio-Player, das Berechnen von Fortschrittsbalken, das Planen von Wiedergabe-Abschnitten mit AudioBufferSourceNode.start(when, offset, duration) sowie das Prüfen, ob ein dekodierter Clip bestimmte Längenvorgaben erfüllt (z. B. maximal 30 Sekunden für Sprachnachrichten).

Da ein AudioBuffer nach dem Anlegen eine feste Länge hat, ändert sich duration nie. Wiedergabegeschwindigkeit (playbackRate) oder detune einer Quelle wirken sich nicht auf diesen Wert aus — die tatsächliche Abspieldauer muss man in diesem Fall selbst ausrechnen.

Rückgabewert

Typ

number

Beschreibung

Gleitkommazahl (Double) mit der Dauer des Puffers in Sekunden, entspricht length / sampleRate.

Beispiele

Dauer einer geladenen Audiodatei ermitteln

const ctx = new AudioContext();

const loadDuration = async (url) => {
  const response = await fetch(url);
  const arrayBuffer = await response.arrayBuffer();
  const audioBuffer = await ctx.decodeAudioData(arrayBuffer);
  return audioBuffer.duration;
};

const seconds = await loadDuration('/sounds/jingle.mp3');
console.log(`Länge: ${seconds.toFixed(2)} s`);

Länge: 4.27 s

Dauer eines selbst erzeugten Puffers

const ctx = new AudioContext();
// 2 Kanäle, 3 Sekunden bei 44,1 kHz
const buffer = ctx.createBuffer(2, 44100 * 3, 44100);

console.log(buffer.duration);
console.log(buffer.length / buffer.sampleRate === buffer.duration);

3 true

Dauer als mm:ss formatieren und Fortschritt anzeigen

const formatTime = (sec) => {
  const m = Math.floor(sec / 60);
  const s = Math.floor(sec % 60).toString().padStart(2, '0');
  return `${m}:${s}`;
};

const play = (ctx, buffer) => {
  const source = ctx.createBufferSource();
  source.buffer = buffer;
  source.connect(ctx.destination);
  const startTime = ctx.currentTime;
  source.start();

  const timer = setInterval(() => {
    const elapsed = Math.min(ctx.currentTime - startTime, buffer.duration);
    console.log(`${formatTime(elapsed)} / ${formatTime(buffer.duration)}`);
    if (elapsed >= buffer.duration) clearInterval(timer);
  }, 1000);
};

0:00 / 3:12 0:01 / 3:12 ...

Tatsächliche Abspieldauer bei geänderter playbackRate

const ctx = new AudioContext();
const buffer = ctx.createBuffer(1, 48000 * 10, 48000); // 10 s

const source = ctx.createBufferSource();
source.buffer = buffer;
source.playbackRate.value = 2;

const realDuration = buffer.duration / source.playbackRate.value;
console.log(buffer.duration, realDuration);

10 5

// Wichtig · Fallstricke

Schreibgeschützt: Eine Zuweisung wie buffer.duration = 5 wird stillschweigend ignoriert (im Strict Mode wird ein TypeError geworfen). Für eine andere Länge muss ein neuer Puffer erzeugt werden.
Gleitkomma-Ungenauigkeit: Da der Wert aus length / sampleRate entsteht, ist er selten eine „runde“ Zahl. Für exakte Berechnungen besser mit length (Sample-Frames) arbeiten.
Resampling bei decodeAudioData(): Dekodierte Daten werden auf die sampleRate des AudioContext umgerechnet. length ändert sich dadurch, duration bleibt aber (bis auf Rundung) gleich. Bei MP3 kann die Dauer durch Encoder-Padding minimal von der Angabe anderer Programme abweichen.
playbackRate/detune werden nicht berücksichtigt; duration beschreibt immer die Länge bei normaler Geschwindigkeit.
Kompatibilität: In allen modernen Browsern verfügbar; sehr alte WebKit-Versionen benötigten webkitAudioContext. In Node.js nur über Drittbibliotheken (z. B. node-web-audio-api).

Siehe auch

AudioBuffer AudioBuffer.length AudioBuffer.sampleRate AudioBuffer.numberOfChannels BaseAudioContext.decodeAudioData() AudioBufferSourceNode AnimationTimeline.duration