How to avoid echo and noise in javascript for webrtc

Question

I am trying to implement a webrtc-based chat room. And I encountered the following problems in laptop. Without connecting to any other peer, just use getUserMedia(), I can get local video stream.

When I unmuted the <video>, echo happened.

Then I wear headphones, and found there is a continued noise. And I can hear my voice clearly.

I tried to turn down the volume, but it doesn't work.

Thanks in advance.

Trike

If @tom-vLine 's answer has solved your issue, please mark it as the answer – Bibliofilm

Answer 1

Make sure that you are muting the local <video> element if you have it in the DOM:

<video id="vid1" autoplay="true" muted="muted"></video>

See this post on the discuss-webrtc mailing list for more details and the WebRTC samples.

Overbalance

If you mute it, it won't capture any sound, will it? – West

The stream will still capture sound even if the local playback element is muted. Muting the element in the DOM will just mute local playback. To mute the outgoing audio stream itself, you'll want to do localMediaStream.getAudioStreams()[0].enabled = false or localMediaStream.getVideoStreams()[0].enabled = false to keep the sound going but disable the video stream. This assumes you saved the media stream somewhere in your onaddstream() callback. – Spangle

Is there a way to remove the echo without losing the sound? – Tarpon

@DNM, you won't loose sound with this mute. – Affinal

Thank You.. This answer saved me. – Computation

Very helpful, thank you. This fixed it, and @BenjaminNolan explaining that if it's muted you don't lose the audio from the recording was also helpful. Thanks y'all! – Ado

Answer 2

Do the followings:

1) In localVideo do the this:

localVideo.volume = 0;

localVideo.muted = 0;

2) Do same for the remoteVideo also:

remoteVideo.volume = 0;

remoteVideo.muted = 0;

Crossindex

muted attribute didn't help, maybe because of Angular 4 which I use. But this works perfectly document.getElementById('yourVideo').volume = 0 – Cobalt

Answer 3

To resolve noise related issue, you should set autoplay=false for localstream.

Franky

Could you please elaborate more your answer adding a little more description about the solution you provide? – Ingenue

autoplay=false just not allow the video to be played automatically. It doesn't have anything to do with audio. – Ulyanovsk