Signatur
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
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);
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');
}
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);
}
// 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 aufnew MediaStreamAudioSourceNode(ctx, { mediaStream: new MediaStream([track]) })aus. - Ist
mediaStreamTrack.kindnicht"audio", wird einInvalidStateErrorausgelöst. FehltmediaStreamTrack, gibt es einenTypeError. - Browser starten einen
AudioContextoft im Zustandsuspended(Autoplay-Richtlinie). Rufectx.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 duquelle.disconnect()undtrack.stop()auf. - Wenn du den Mikrofon-Knoten direkt mit
ctx.destinationverbindest, entsteht leicht eine Rückkopplung. Verbinde ihn nur, wenn das wirklich gewollt ist, etwa bei Kopfhörern.