为了账号安全,请及时绑定邮箱和手机立即绑定

更改 WebRTC 流中的播放延迟

更改 WebRTC 流中的播放延迟

温温酱 2021-06-14 10:40:08
我正在尝试将实时 MediaStream(最终从相机)从 peerA 投射到 peerB,我希望 peerB 实时接收实时流,然后以额外的延迟重播。不幸的是,不能简单地暂停流并继续播放,因为它会跳转到实时时刻。所以我发现我可以使用 MediaRecorder + SourceBuffer 重新观看直播。记录流并将缓冲区附加到 MSE (SourceBuffer) 并在 5 秒后播放。这适用于本地设备(流)。但是当我尝试在接收器上使用 Media Recorder 时,MediaStream (from pc.onaddstream) 看起来像是获取了一些数据,并且能够将缓冲区附加到 sourceBuffer。但是它不会重播。有时我只得到一帧。const [pc1, pc2] = localPeerConnectionLoop()const canvasStream = canvas.captureStream(200)videoA.srcObject = canvasStreamvideoA.play()// Note: using two MediaRecorder at the same time seem problematic// But this one works// stream2mediaSorce(canvasStream, videoB)// setTimeout(videoB.play.bind(videoB), 5000)pc1.addTransceiver(canvasStream.getTracks()[0], {  streams: [ canvasStream ]})pc2.onaddstream = (evt) => {  videoC.srcObject = evt.stream  videoC.play()  // Note: using two MediaRecorder at the same time seem problematic  // THIS DOSE NOT WORK  stream2mediaSorce(evt.stream, videoD)  setTimeout(() => videoD.play(), 2000)}/** * Turn a MediaStream into a SourceBuffer *  * @param  {MediaStream}      stream   Live Stream to record * @param  {HTMLVideoElement} videoElm Video element to play the recorded video in * @return {undefined} */function stream2mediaSorce (stream, videoElm) {  const RECORDER_MIME_TYPE = 'video/webm;codecs=vp9'  const recorder = new MediaRecorder(stream, { mimeType : RECORDER_MIME_TYPE })  const mediaSource = new MediaSource()  videoElm.src = URL.createObjectURL(mediaSource)  mediaSource.onsourceopen = (e) => {    sourceBuffer = mediaSource.addSourceBuffer(RECORDER_MIME_TYPE);你知道为什么它不能播放视频吗?我已经创建了一个包含所有必要代码的小提琴来尝试它,javascript 选项卡与上面的代码相同,(html 大多无关紧要,不需要更改)有些人试图减少延迟,但我实际上想将其增加到大约 10 秒以重新观看您在高尔夫挥杆中做错的事情或其他事情,如果可能,完全避免使用 MediaRecorder编辑: 我在一些 RTC 扩展中发现了一个叫做“播放延迟”的东西允许发送者控制从捕获到渲染时间的最小和最大延迟https://webrtc.org/experiments/rtp-hdrext/playout-delay/我怎样才能使用它?对我有帮助吗?
查看完整描述

1 回答

  • 1 回答
  • 0 关注
  • 716 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信