video标签加载视频有声音却黑屏
问题
昨天用户上传了一个视频文件,然而发现虽然有声音但是黑屏。
解释
因为原视频的编码是用 mp4v 格式的,它需要专用的解码器。而 chrome 并不支持,所以无法播放。
然后如果用转码功能转成用 H.264 编码,就可以播放了。
上图的 AVC 实际上是 H.264 协议的别名。自从 H.264 协议中增加了 SVC 的部分之后,人们习惯将不包含 SVC 的 H.264 协议那一部分称为 AVC,而将 SVC 这一部分单独称为 SVC。
浏览器视频格式编码参照
最后 chrome 的视频解码格式请查阅 MDN-audio和video元素-浏览器兼容情况
截止2020年3月,video 标签支持的
Feature---Chrome---Firefox---IE---Opera---Safari
VP8 and Vorbis in WebM---6.0---4.0 (2.0)---9.0[8]---10.60---3.1[9]
VP9 and Opus in WebM---29.0---28.0 (28.0)[36]---?---(Yes)---?
Streaming WebM via MSE---?---42.0 (42.0)[35]---?---?---?
Theora and Vorbis in Ogg---(Yes)---3.5 (1.9.1)---未实现---10.50---未实现
H.264 and MP3 in MP4---(Yes)[3]---(Yes)[10]---9.0---(Yes)---(Yes)
H.264 and AAC in MP4---(Yes)[4]---(Yes)[11]---9.0---(Yes)---3.1
FLAC in MP4---62.0---51 (51)---?---?---?