MediaStreamAudioSourceNode

L'interface MediaStreamAudioSourceNode représente une source audio WebRTC MediaStream (comme une webcam ou un micro). C'est un AudioNode qui agit comme une source audio.

Un MediaElementSourceNode n'a pas d'entrée et une seule sortie. On le créé en utilisant la méthode AudioContext.createMediaStreamSource. Le nombre de canaux de sortie est égal au nombre de canaux de AudioMediaStreamTrack. SS'l n'y a pas de media stream valide, alors la sortie sera constituée d'un seul canal silencieux.

Nombre d'entrées 0
Nombre de sorties 1
Nombre de canaux Défini par AudioMediaStreamTrack et passé à la méthode AudioContext.createMediaStreamSource qui le créé.

Constructeur

MediaStreamAudioSourceNode.MediaStreamAudioSourceNode()
Créé une nouvelle instance de MediaStreamAudioSourceNode.

Propriétés

Hérite des propriétés de son parent, AudioNode.

Méthodes

Hérite des méthdoes de son parent, AudioNode.

Exemple

In this example, we grab a media (audio + video) stream from navigator.getUserMedia, feed the media into a <video> element to play then mute the audio, but then also feed the audio into a MediaStreamAudioSourceNode. Next, we feed this source audio into a low pass BiquadFilterNode (which effectively serves as a bass booster), then a AudioDestinationNode.

The range slider below the <video> element controls the amount of gain given to the lowpass filter — increase the value of the slider to make the audio sound more bass heavy!

Note: You can see this example running live, or view the source.

var pre = document.querySelector('pre');
var video = document.querySelector('video');
var myScript = document.querySelector('script');
var range = document.querySelector('input');

// getUserMedia block - grab stream
// put it into a MediaStreamAudioSourceNode
// also output the visuals into a video element

if (navigator.mediaDevices) {
    console.log('getUserMedia supported.');
    navigator.mediaDevices.getUserMedia ({audio: true, video: true})
    .then(function(stream) {
        video.srcObject = stream;
        video.onloadedmetadata = function(e) {
            video.play();
            video.muted = true;
        };

        // Create a MediaStreamAudioSourceNode
        // Feed the HTMLMediaElement into it
        var audioCtx = new AudioContext();
        var source = audioCtx.createMediaStreamSource(stream);

        // Create a biquadfilter
        var biquadFilter = audioCtx.createBiquadFilter();
        biquadFilter.type = "lowshelf";
        biquadFilter.frequency.value = 1000;
        biquadFilter.gain.value = range.value;

        // connect the AudioBufferSourceNode to the gainNode
        // and the gainNode to the destination, so we can play the
        // music and adjust the volume using the mouse cursor
        source.connect(biquadFilter);
        biquadFilter.connect(audioCtx.destination);

        // Get new mouse pointer coordinates when mouse is moved
        // then set new gain value

        range.oninput = function() {
            biquadFilter.gain.value = range.value;
        }
    })
    .catch(function(err) {
        console.log('The following gUM error occured: ' + err);
    });
} else {
   console.log('getUserMedia not supported on your browser!');
}

// dump script to pre element

pre.innerHTML = myScript.innerHTML;

Note: As a consequence of calling createMediaStreamSource(), audio playback from the media stream will be re-routed into the processing graph of the AudioContext. So playing/pausing the stream can still be done through the media element API and the player controls.

 

Spécification

Specification Status Comment
Web Audio API
La définition de 'MediaStreamAudioSourceNode' dans cette spécification.
Version de travail  

Compatibilité des navigateurs

Fonctionnalité Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Support basique 14 webkit (Oui) 25 (25) Pas de support 15 webkit
22 (unprefixed)
6 webkit
Constructor (Oui) ? Pas de support Pas de support ? Pas de support
Fonctionnalité Android Chrome Edge Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Support basique Pas de support 28 webkit (Oui) 25.0 (25) Pas de support Pas de support webkit
Constructeur Pas de support (Oui) ? Pas de support Pas de support ? Pas de support

Voir aussi

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : marie-ototoi, Nek-
 Dernière mise à jour par : marie-ototoi,