目标:使用MediaRecorder(或其他)API生成可在各个平台上查看的视频文件。
失败:当前API在Google Chrome上回退到容器/编解码器,只能在Chrome和高级桌面媒体播放器上查看,而无法在Safari或移动设备上查看。
!在Safari上运行相同的代码会生成所有平台都可以使用的工作视频文件。
const mimeType = 'video/webm;codecs=H264'
rec = new MediaRecorder(stream.current, { mimeType })
rec.ondataavailable = e => blobs.push(e.data)
rec.onstop = async () => {
saveToFile(new Blob(blobs, { type: mimeType }))
}
尝试了各种不同的容器和编解码器的组合,还尝试使用 MP4 文件容器覆盖 Blob 的 mimeType。但是完全没有成功。
还尝试了以下内容:
https://github.com/streamproc/MediaStreamRecorder
https://github.com/muaz-khan/RecordRTC
有同样的问题。看起来Chrome的容器/编解码器组合总是会回退到一种格式,只能在Chrome或像VLC这样的强大桌面视频播放器上直接查看。
对我来说唯一跨平台工作的视频是从Safari浏览器中拍摄的,它在上图中位于第5个位置。
在MediaCapture API中使用哪种正确的容器/编解码器,以使输出文件在各个平台上都可以播放。
编辑 -
我们最终建立了一个转码管道,使用AWS ElasticTranscoder将上传的视频进行转码,并使用通用预设进行转码,从而创建一个可在所有平台上播放的转换后的视频文件。
- 不幸的是,我提供的赏金已经过期了,但如果有人回答原始问题,我将很乐意再次奖励他。