Javascript Firefox不播放Chrome中录制的视频

Javascript Firefox不播放Chrome中录制的视频,javascript,reactjs,firefox,web-mediarecorder,Javascript,Reactjs,Firefox,Web Mediarecorder,我有一段视频是用这个react插件在Chrome上录制的:。此视频将上载到服务器 视频在Chrome中播放得很好。但是,Firefox中不会打开相同的视频。相反,在Firefox中录制的视频在Chrome和Firefox中都能正常播放 |适用于Firefox |适用于Chrome| -----------+----------+---------+ 记录在Firefox | Y | Y中| -----------+----------+---------+ 用铬记录| 我们如何解决这个问题?问题

我有一段视频是用这个react插件在Chrome上录制的:。此视频将上载到服务器

视频在Chrome中播放得很好。但是,Firefox中不会打开相同的视频。相反,在Firefox中录制的视频在Chrome和Firefox中都能正常播放

|适用于Firefox |适用于Chrome| -----------+----------+---------+ 记录在Firefox | Y | Y中| -----------+----------+---------+ 用铬记录|
我们如何解决这个问题?

问题是,尽管您使用的库要求Chrome将录制内容编码为vp8,但Chrome可能将其编码为h246。您可以在要求专门检查vp8支持的库中看到这一行:

库还要求用户代理在此行中编码视频/webm:

然而,似乎用户代理在创建Blob时可以自由地使用它想要的任何编解码器进行编码

我创建了一个玩具项目来模拟库正在做什么,并试图在创建Blob似乎没有效果时指定编解码器。以下是每个用户代理的每个保存文件的ffprobe输出:

铬 输入0,matroska,webm,来自'recording.chrome.webm': 元数据: 编码器:铬 持续时间:不适用,起始时间:0.000000,比特率:不适用 流0:0英语:音频:opus,48000 Hz,单声道,fltp默认值 流0:1eng:视频:h264基线,YUV420P渐进,1280x720[SAR 1:1 DAR 16:9],16.67 fps,16.67 tbr,1k tbn,2k tbc默认值 火狐 从'recording.firefox.webm'输入0,matroska,webm: 元数据: 编码器:QTmuxingAppLibWebM-0.0.1 持续时间:不适用,开始时间:-0.001000,比特率:不适用 流0:0英语:视频:vp8,YUV420P渐进式,1280x720,SAR 1:1 DAR 16:9,30 fps,30 tbr,1k tbn,1k tbc默认值 流0:1eng:音频:opus,48000 Hz,单声道,fltp默认值 考虑到这一点,最好的做法是不要依赖浏览器将录制内容编码为所有浏览器都可以播放的格式。您可以将视频重新编码为更广泛的用户代理可以使用的格式,或者让用户将其视频上载到服务器,您可以在服务器上为其重新编码,然后使用标记有条件地提供内容


您还应该阅读这篇关于支持的文件类型的MDN文章:。

检查Chrome录制使用的编解码器,检查Firefox录制使用的编解码器,让Chrome使用Firefox的编解码器。这个问题更适合于,因为它涉及到如何使用软件,而不是如何构建它。我正在使用这个插件@jpaugh,我认为这是有争议的。这很可能是受支持的编解码器问题。如果使用不支持的编解码器提供视频,则需要更改内容的提供方式,这对我来说是一个构建问题。@zero298。至少在目前的情况下,这是无法回答的。OP可能需要SU的帮助来发现它是否确实是一个编解码器问题。疯狂。我无法理解为什么谷歌会忽略一些应该通过API配置的东西。正如OP和我所发现的,这会产生其他浏览器或至少FF无法播放的视频。
let types = ['video/webm;codecs=vp8', 'video/webm', ''];
let blob = new Blob(this.mediaChunk, { type: 'video/webm' });