WebRTC/getUserMedia : How to properly mute local video?

Question

我正在尝试在WebRTC应用程序中实现使本地视频MediaStreamTrack静音的功能。这是我正在处理的方法:

function muteVideo() {
  if (this._localStream && this._localStream.getVideoTracks().length > 0) {
    this._localStream.getVideoTracks()[0].enabled = false;
  }
}

在Firefox中，正确连接了本地流的 <video>元素会在静音时呈现黑色。在Chrome浏览器中，不会呈现黑色，但图像会卡住。但是，在这两种浏览器中，相机的绿灯 都停留在上，这显然是不希望的行为。 (我希望我的用户看到该应用程序实际上在视频静音时已从相机断开连接。)

如果我执行 this._localStream.stop()，则相机的灯会熄灭，但随后音频也会熄灭。

Media Capture规范的 current draft提到了 MediaStreamTrack.stop()方法，但目前似乎在Chrome和Firefox中未实现。

因此，有一种方法可以在以下情况下使本地视频静音:

使相机的灯光熄灭

不丢失音轨吗？

Answer 1

今天
track.stop()在Firefox中可以正常工作。 Chrome落后了。结束轨道的规范方式(https fiddle):

navigator.mediaDevices.getUserMedia({video: true, audio: true})
  .then(stream => video.srcObject = stream)
  .catch(e => log(e.name + ": "+ e.message));

let stop = k => video.srcObject.getTracks().map(t => t.kind == k && t.stop());

<video id="video" width="160" height="120" autoplay></video><br>
<button onclick="stop('video')">Stop Video</button>
<button onclick="stop('audio')">Stop Audio</button>

这使您可以在保留音频的同时关闭视频，而无需在Firefox中重新提示。重新打开视频时，您仍然会收到提示，因此效果并不完美，但效果提高了50％。

在Chrome catch 潮流之前，您的其他答案(每次都删除并重新进行胶粘)应该在那里起作用，因为它们永远不会提示您。

通过浏览器检测并组合这些答案，应该有可能提出一种在多个浏览器中都可以正常工作的方法，直到浏览器 catch 来。

长期

规范最近通过允许浏览器在暂时静音期间关闭摄像头灯(例如 track.enabled == false)来启用 addressed this，前提是摄像头访问指示灯保持亮起:

"The User Agent is encouraged to provide ongoing indication of the current state of anyAccessible.

The User Agent is encouraged to provide ongoing indication of the current state of anyLive and to make any generic hardware device indicator light match."

规范中的这些声明之前使用更强的语言，从而使指标成为必需。

当前，浏览器无法正确实现此目的。 Chrome浏览器已关闭，在最近访问后，其网址栏中的摄像头访问指示符很小，但在页面加载时却没有出现，以警告先前的访问已授予持久访问权限；该站点可以随时打开相机。