如何修改WebRTC MediaStream视频轨道的内容?
How to modify the content of WebRTC MediaStream video track?
我在客户端视频流录制在第三方服务器的场景下使用WebRTChttps://tokbox.com/。我想在录制的视频中添加某种水印。
调查让我进入了这个页面 http://w3c.github.io/webrtc-pc/#mediastreamtrack 似乎在技术上是可行的,因为它说:
A MediaStream acquired using getUserMedia() is, by default, accessible to an application. This means that the application is able to access the contents of tracks, modify their content, and send that media to any peer it chooses.
这正是我需要的,但我没有找到任何关于此功能的示例或解释。我想从 WebRTC 专家那里得到一些建议。
您需要使用 canvas 将视频从 getUserMedia 路由到,在那里进行修改,然后使用 canvas.captureStream() 将其转回 MediaStream。这很棒——除了 canvas.captureStream(),虽然在 WG 中得到同意,但实际上尚未包含在规范中。 (有一个拉取请求,其中包含 Mozilla 编写的建议措辞。)
就实现而言:captureStream() 的初始实现刚刚登陆 Firefox Nightly (41),并且在修复一两个错误之前它仍然落后于首选项。您可以在 about:config 中使用 canvas.capturestream.enabled 启用它。您可以在 Mozilla's test page for captureStream().
查看演示
不使用 canvas.captureStream() 会很困难;您最好的方法是执行 getUserMedia->canvas-> 然后使用 video.captureStream() (或 captureStreamUntilEnded()) - 但是,video.captureStream 也在等待正式接受。然而,Mozilla 已经使用 video.captureStream() 一段时间了,我认为它适用于 FF 38(当前版本)。
我在客户端视频流录制在第三方服务器的场景下使用WebRTChttps://tokbox.com/。我想在录制的视频中添加某种水印。
调查让我进入了这个页面 http://w3c.github.io/webrtc-pc/#mediastreamtrack 似乎在技术上是可行的,因为它说:
A MediaStream acquired using getUserMedia() is, by default, accessible to an application. This means that the application is able to access the contents of tracks, modify their content, and send that media to any peer it chooses.
这正是我需要的,但我没有找到任何关于此功能的示例或解释。我想从 WebRTC 专家那里得到一些建议。
您需要使用 canvas 将视频从 getUserMedia 路由到,在那里进行修改,然后使用 canvas.captureStream() 将其转回 MediaStream。这很棒——除了 canvas.captureStream(),虽然在 WG 中得到同意,但实际上尚未包含在规范中。 (有一个拉取请求,其中包含 Mozilla 编写的建议措辞。)
就实现而言:captureStream() 的初始实现刚刚登陆 Firefox Nightly (41),并且在修复一两个错误之前它仍然落后于首选项。您可以在 about:config 中使用 canvas.capturestream.enabled 启用它。您可以在 Mozilla's test page for captureStream().
查看演示不使用 canvas.captureStream() 会很困难;您最好的方法是执行 getUserMedia->canvas-> 然后使用 video.captureStream() (或 captureStreamUntilEnded()) - 但是,video.captureStream 也在等待正式接受。然而,Mozilla 已经使用 video.captureStream() 一段时间了,我认为它适用于 FF 38(当前版本)。