CODEWITHSUNDEEP
javascriptwebrtc
Paul Gregoire
Paul Gregoire

Reputation: 9793

WebRTC - How to mute local audio output

I'm trying to mute only the local audio playback in WebRTC, more specifically after getUserMedia() and prior to any server connection being made. None of the options I've found work; this one from Muaz Khan fails:

var audioTracks = localMediaStream.getAudioTracks();
// if MediaStream has reference to microphone
if (audioTracks[0]) {
    audioTracks[0].enabled = false;
}

source

This technique is also described here as "working", but fails here on Chrome Version 39.0.2171.95 (64-bit) (Ubuntu 14.04).

Additional method that is said to work by using volume gain:

window.AudioContext = window.AudioContext || window.webkitAudioContext;
var audioContext = new AudioContext();
var source = audioContext.createMediaStreamSource(clientStream);
var volume = audioContext.createGain();
source.connect(volume);
volume.connect(audioContext.destination);
volume.gain.value = 0;  //turn off the speakers

tl;dr I don't want to hear the input from my microphone on my speakers, but I do want to see my video image.

Workaround

This workaround was suggested by Benjamin Trent and it mutes the audio by setting the muted attribute on the video tag like so:

document.getElementById("html5vid").muted = true;

Also similar question, but its for video, so not the same

Upvotes: 23

Views: 21914

Answers (1)

xdumaine
xdumaine

Reputation: 10329

Adding this as the answer because it is the de facto correct answer:

What you stated as a workaround is what's used by many major WebRTC Video platforms:

navigator.mediaDevices.getUserMedia({ video: true, audio: true })
  .then(stream => {
    const vid = document.getElementById('html5vid');
    vid.autoplay = true;
    vid.muted = true;
    vid.srcObject = stream;
  });

Upvotes: 23

Related Questions