Start · Sprachen · JavaScript · Referenz · new MediaStreamTrackAudioSourceNode()

new MediaStreamTrackAudioSourceNode()

Methode

Erzeugt einen Audio-Quellknoten, der genau einen <code>MediaStreamTrack</code> vom Typ <code>audio</code> als Eingangssignal in einen Web-Audio-Graphen einspeist.

seit JavaScript Eingeschränkte Unterstützung: Firefox 68+; in Chro Kategorie: webapi

Signatur

new MediaStreamTrackAudioSourceNode(context, options)

Beschreibung

Der Konstruktor MediaStreamTrackAudioSourceNode() erzeugt einen Quellknoten der Web Audio API. Sein Signal stammt aus einem einzelnen MediaStreamTrack, zum Beispiel vom Mikrofon (getUserMedia()), von einer Bildschirmfreigabe mit Systemton (getDisplayMedia()) oder von einer WebRTC-Gegenstelle (RTCPeerConnection). Der Knoten hat keinen Eingang und einen Ausgang. Die Anzahl der Kanäle richtet sich nach dem Track.

Im Unterschied zu MediaStreamAudioSourceNode wählst du hier gezielt einen Track aus. Wenn ein MediaStream mehrere Audio-Tracks enthält, nimmt MediaStreamAudioSourceNode nur den ersten Track in lexikografischer Reihenfolge der Track-IDs. Welcher das ist, lässt sich praktisch nicht vorhersagen. Mit diesem Konstruktor bestimmst du den Track selbst.

Gleichwertig ist die Fabrikmethode AudioContext.createMediaStreamTrackSource(track). Der Konstruktor hat den Vorteil, dass er zur einheitlichen Konstruktor-Syntax der übrigen AudioNodes passt. Typische Einsatzfälle sind Pegelanzeigen, Spektrumanalysen, Mischen mehrerer Eingangsquellen und die Weiterverarbeitung mit AudioWorklet.

Parameter

Name Typ Default Beschreibung
$context Pflicht AudioContext Der AudioContext, zu dem der Knoten gehören soll. Ein OfflineAudioContext ist nicht erlaubt, weil Live-Tracks nur in Echtzeit verarbeitet werden können.
$options Pflicht { mediaStreamTrack: MediaStreamTrack } Optionsobjekt mit der Pflicht-Eigenschaft mediaStreamTrack. Das ist der Audio-Track (track.kind === "audio"), aus dem das Signal stammt.

Rückgabewert

Typ
MediaStreamTrackAudioSourceNode
Beschreibung
Ein neuer Quellknoten, der mit connect() an weitere AudioNodes angeschlossen werden kann.

Beispiele

Mikrofonpegel mit AnalyserNode messen

const startPegelmesser = async () => {
  const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
  const [track] = stream.getAudioTracks();

  const ctx = new AudioContext();
  const quelle = new MediaStreamTrackAudioSourceNode(ctx, {
    mediaStreamTrack: track,
  });

  const analyser = new AnalyserNode(ctx, { fftSize: 256 });
  quelle.connect(analyser);

  const daten = new Uint8Array(analyser.frequencyBinCount);
  const messen = () => {
    analyser.getByteTimeDomainData(daten);
    const spitze = Math.max(...daten.map((v) => Math.abs(v - 128)));
    console.log(`Pegel: ${Math.round((spitze / 128) * 100)} %`);
    requestAnimationFrame(messen);
  };
  messen();
};

document.querySelector('#start').addEventListener('click', startPegelmesser);
Pegel: 12 % Pegel: 37 % …

Bestimmten Track wählen, mit Fallback für Chromium

const erzeugeQuelle = (ctx, track) => {
  if (typeof MediaStreamTrackAudioSourceNode === 'function') {
    return new MediaStreamTrackAudioSourceNode(ctx, { mediaStreamTrack: track });
  }
  // Fallback: Stream bauen, der nur diesen einen Track enthält
  return new MediaStreamAudioSourceNode(ctx, {
    mediaStream: new MediaStream([track]),
  });
};

const ctx = new AudioContext();
const stream = await navigator.mediaDevices.getDisplayMedia({ video: true, audio: true });
const systemTon = stream.getAudioTracks()[0];

if (systemTon) {
  const quelle = erzeugeQuelle(ctx, systemTon);
  const lautstaerke = new GainNode(ctx, { gain: 0.5 });
  quelle.connect(lautstaerke).connect(ctx.destination);
  console.log('Systemton wird mit 50 % wiedergegeben');
}
Systemton wird mit 50 % wiedergegeben

Fehler bei falschem Track-Typ abfangen

const ctx = new AudioContext();
const stream = await navigator.mediaDevices.getUserMedia({ video: true });
const [videoTrack] = stream.getVideoTracks();

try {
  new MediaStreamTrackAudioSourceNode(ctx, { mediaStreamTrack: videoTrack });
} catch (err) {
  console.log(err.name);
}
InvalidStateError

// Wichtig · Fallstricke

  • Browser-Kompatibilität: Derzeit unterstützt praktisch nur Firefox (ab Version 68) diesen Konstruktor. Chrome und Edge bieten weder ihn noch createMediaStreamTrackSource() an. Prüfe die Verfügbarkeit per Feature-Detection und weiche auf new MediaStreamAudioSourceNode(ctx, { mediaStream: new MediaStream([track]) }) aus.
  • Ist mediaStreamTrack.kind nicht "audio", wird ein InvalidStateError ausgelöst. Fehlt mediaStreamTrack, gibt es einen TypeError.
  • Browser starten einen AudioContext oft im Zustand suspended (Autoplay-Richtlinie). Rufe ctx.resume() nach einer Nutzerinteraktion auf.
  • Den Track aus getUserMedia() bekommst du nur in einem sicheren Kontext (HTTPS) und mit Zustimmung des Nutzers.
  • Wird der Track beendet (track.stop() oder Gerät getrennt), liefert der Knoten Stille. Zum Aufräumen rufst du quelle.disconnect() und track.stop() auf.
  • Wenn du den Mikrofon-Knoten direkt mit ctx.destination verbindest, entsteht leicht eine Rückkopplung. Verbinde ihn nur, wenn das wirklich gewollt ist, etwa bei Kopfhörern.