Question

我在HTML5中有一个视频标签，用于显示移动应用中的资源。用户可以使用他们的设备上传任何类型的视频。

这是标签：

＆＃13;

<video width="100%" controls autoplay onended="closeVideo(this)">
    <source src="route.mp4" type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"'/>
    <source src="route.mp4" type='video/webm; codecs="vp8, vorbis"'/>
    <source src="route.mp4" type='video/ogg; codecs="theora, vorbis"'/>
    Your browser can't play this kind of video, sorry.
</video>

＆＃13;

大多数视频都能正常工作，但其中一些视频会显示声音但没有显示图像。

问题不在文件中，因为如果在计算机中下载它们可以正常工作。我无法弄清楚视频中不起作用的模式，它们有不同的格式，大小，比例和fps。

感谢您的回答

Answer 1

我建议使用转码服务（SYNQ.fm，Encoding.com，Amazon Elastic Transcode，Zencoder）来转换用户上传的视频，这样您就可以保证他们能够正常播放（假设上传的视频是没有损坏或使用未知的视频编解码器创建）因为您不能假设用户将上传已经兼容在所有可用的各种移动设备和浏览器上播放的视频。因此，您的代码看起来像这样：

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

您提供的mp4文件使用H.264编解码器进行编码，并且提供的ogg文件使用Ogg编解码器进行编码。在转码方面，我建议将上传到您系统的视频文件转码为mp4和webm或ogg。这也有助于让您的应用在播放方面更加可靠，因为您定义视频输出，您将获得一致性，而不是不同的尺寸，fps，编解码器等。

以下是一些可以提供帮助的文档：https://www.w3schools.com/html/html5_video.asp，这也会告诉您哪些浏览器与哪些视频编解码器兼容，以及哪些浏览器支持HTML5视频。

HTML5视频代码无法显示图片

1 个答案: