WebRTC技术详解：从0到1构建多人视频会议系统
上QQ阅读APP看书，第一时间看更新
上一章目录下一章

2.2.2　MediaStreamTrack方法

1. applyConstraints()方法

该方法为媒体轨道指定约束条件，如可以指定帧率、分辨率、回音消除等。

可以根据需要使用约束定制媒体流，比如在采集清晰度高的视频时，可以将帧率降低一些，这样就不至于占用太大的网络带宽。

const appliedPromise = track.applyConstraints([constraints])
  • 参数：constraints，可选参数，一个类型为MediaTrackConstraints的对象，包含了准备应用到媒体轨道里的所有约束需求，未在需求中指定的约束将使用默认值。如果constraints为空，则会清除当前轨道所有的自定义效果，全部使用默认值。
  • 返回值：appliedPromise是一个Promise值，决议失败时返回MediaStreamError。当指定的约束太严格时，可能会导致该方法调用失败。

如代码清单2-12所示，使用getUserMedia()方法获取视频流，并针对第一个视频轨道应用约束条件，约束指定了视频的宽、高和宽高比。

代码清单2-12　applyConstraints()方法示例

const constraints = {
  width: {min: 640, ideal: 1280},
  height: {min: 480, ideal: 720},
  aspectRatio: { ideal: 1.7777777778 }
};

navigator.mediaDevices.getUserMedia({ video: true })
.then(mediaStream => {
  const track = mediaStream.getVideoTracks()[0];
  track.applyConstraints(constraints)
  .then(() => {
    // 成功应用了约束条件
    console.log('successed!');
  })
  .catch(e => {
    // 不能满足约束条件
    console.log('applyConstraints error, error name: ' + e.name);
  });
});
2. clone()方法

获取媒体轨道的副本，新的轨道具有不同的ID值。

const newTrack = track.clone()
3. getCapabilities()方法

获取媒体轨道的能力集。

const capabilities = track.getCapabilities()
  • 参数：无。
  • 返回值：MediaTrackCapabilities对象，描述了媒体轨道的能力信息。

MediaTrackCapabilities的定义如代码清单2-13所示。

代码清单2-13　MediaTrackCapabilities的定义

dictionary MediaTrackCapabilities {
  ULongRange width;
  ULongRange height;
  DoubleRange aspectRatio;
  DoubleRange frameRate;
  sequence<DOMString> facingMode;
  sequence<DOMString> resizeMode;
  ULongRange sampleRate;
  ULongRange sampleSize;
  sequence<boolean> echoCancellation;
  sequence<boolean> autoGainControl;
  sequence<boolean> noiseSuppression;
  DoubleRange latency;
  ULongRange channelCount;
  DOMString deviceId;
  DOMString groupId;
};

代码清单2-14获取媒体轨道的能力集，并将媒体能力输出到日志。

代码清单2-14　getCapabilities()方法示例

const capabilities = track.getCapabilities()
// 遍历capabilities，将媒体能力输出到日志
Object.keys(capabilities).forEach(value => {
  console.log(value + '=>' + capabilities[value]);
})

媒体能力、约束、设定值的概念相近，有区别，也有联系，我们将在2.3节详细讨论。

4. getConstraints()方法

获取最近一次调用applyConstraints()传入的自定义约束。

const constraints = track.getConstraints()
  • 参数：无。
  • 返回值：MediaTrackConstraints对象，包含了媒体轨道的约束集。

代码清单2-15实现了摄像头的切换。

代码清单2-15　getConstraints()方法示例

function switchCameras(track, camera) {
  const constraints = track.getConstraints();
  constraints.facingMode = camera;
  track.applyConstraints(constraints);
}
5. getSettings()方法

获取媒体轨道约束的当前值。

const settings = track.getSettings()
  • 输入：无。
  • 返回值：MediaTrackSettings对象，包含媒体轨道约束的当前值。

MediaTrackSettings的定义如代码清单2-16所示。

代码清单2-16　MediaTrackSettings的定义

dictionary MediaTrackSettings {
  long width;
  long height;
  double aspectRatio;
  double frameRate;
  DOMString facingMode;
  DOMString resizeMode;
  long sampleRate;
  long sampleSize;
  boolean echoCancellation;
  boolean autoGainControl;
  boolean noiseSuppression;
  double latency;
  long channelCount;
  DOMString deviceId;
  DOMString groupId;
};

获取当前使用的摄像头，如代码清单2-17所示。

代码清单2-17　getSettings()方法示例

function whichCamera(track) {
  return track.getSettings().facingMode;
}
6. stop()方法

用于停止播放当前媒体轨道。如果多个媒体轨道与同一个源相连，停止某个轨道不会导致源终止，只有当所有相连媒体轨道都停止时，媒体源才会停止。调用该方法后，属性readyState将被设置为ended。

track.stop()
  • 输入：无。
  • 返回值：无。

代码清单2-18从video元素的srcObject属性获取媒体流，然后调用getTracks()方法获取所有媒体轨道，遍历媒体轨道数组并调用stop()方法逐一停止播放。

代码清单2-18　stop()方法示例

function stopStreamedVideo(videoElem) {
  const stream = videoElem.srcObject;
  const tracks = stream.getTracks();
  tracks.forEach(track => {
    track.stop();
  });
  videoElem.srcObject = null;
}
上一章目录下一章