时间戳

首页 > 解决方案 > 在 Safari 的视频对象中显示在 WebRTC 中录制的视频

javascript - 在 Safari 的视频对象中显示在 WebRTC 中录制的视频

问题描述

当使用 WebRTC 直接从用户网络摄像头录制视频时，您会得到一个带有视频的 BLOB 对象。

video.src = window.URL.createObjectURL(blob);

当尝试将 blob 应用到视频元素时（例如，使用上面的代码或其他替代方法，如 webkitURL 等......如此处所示https://stackoverflow.com/a/59934597/311188），它在 Safari 中失败。

它显示视频控件，但显示 0 秒，并且播放什么也不做。

有人创建了一个示例来实现这一点，但它使用文件（https://bl.ocks.org/unRob/3bd07a012597aa959c92）并且 Safari 中不允许使用文件

我一直在寻找如何在 Safari 中创建文件，但它不起作用。

如何将 blob 直接放在视频元素中，以便用户可以播放和预览他刚刚录制的内容？

标签： javascriptsafariwebrtc

解决方案

如果您使用的是 WebRTC，我假设您正在获取内容，如下所示：

const mediaStream = await navigator.mediaDevices.getUserMedia({ audio: true, video: true })

在这种情况下，您只需将该流附加到您的视频元素上：

video.srcObject = mediaStream

推荐阅读