从 Opentok.js 订阅者获取 MediaStream

Get MediaStream from Opentok.js subscriber

我正在使用 @opentok/client 构建一个用于简单多用户视频聊天的 Angular6 应用程序。

我想使用 hark.js 进行语音检测来实现 'spotlight'(例如全屏当前正在会话中发言的用户)功能。

问题是这个库需要源 MediaStream 来处理音频并发出我将捕获和处理的事件。

我想从 OpenTok 的订户 class 那里得到 MediaStream,但是没有找到如何这样做的方法,但是由于它基于通用的 WebRTC,所以应该是可行的。

有线索吗?

示例代码:

 this.opentokService.initSession().then((session: OT.Session) => {
  this.session = session;
  this.session.on('streamCreated', (event) => {
    this.streams.push(event.stream); //creates the subscribers elements
    var speechEvents = hark(event.stream, {}); //raises error, how to get a proper MediaStream here?
  });

你是对的,因为 OpenTok 只是普通的 WebRTC,你可以像这样从订阅者的底层视频元素中获取 MediaStream:

const mediaStream = subscriber.element.querySelector('video').srcObject;

这将适用于 Chrome、Firefox、Safari 和 Edge 的最新版本。它在 Internet Explorer 中不起作用,因为它使用插件并且无论如何都没有 MediaStream 对象。

我还想指出,订阅者本身有 audioLevelUpdated 事件,可用于实现相同的目的。该事件为您提供介于 0 和 1 之间的 audioLevel。文档中有一个很好的示例,说明如何将其转换为 dB 范围 https://tokbox.com/developer/sdks/js/reference/Subscriber.html#events

我不确定 hark.js 是否做了一些处理以确保它是语音,如果是的话它可能仍然会更好。不管是不是语音,音频电平事件都是基于噪声。

您可以这样访问:

const mediaStream = subscriber._.webRtcStream()