HTML5_音视频标签 <audio> 和 <video>

HTML5_音视频标签 <audio> 和 <video>

  • 主流视频格式文件格式 (容器格式)

MPEG-4    通常以.mp4为扩展名
Flash视频    通常以.flv为扩展名
Ogg    通常以.ogv为扩展名
WebM    通常以.webm为扩展名


频视频交错    通常以.avi为扩展名


  • 主流音频格式文件格式 (容器格式)

MPEG-3 .mp3
Acc音频 .acc
Ogg音频 .ogg

  • .avi 和 .mp4

仅仅是容器的格式
只是决定怎么将视频存储起来,
而不关心存储的内容
包含了音频轨道,视频轨道和其他一些元数据

  • 元数据

包含了视频的封面,标题,子标题,字幕等相关信息

编解码器
一组算法,用来对一段特定的音频/视频进行编码和解码
原始媒体文件体积巨大,
如果不进行编码,那么数据量非常惊人
如果不进行解码,就无法将编码后的数据重组为原始的媒体数据

  • 视频编解码器

H.264
VP8
Ogg Theora

  • 音频编解码器

AAC
MPEG-3
Ogg Vorbis

  • 浏览器对于容器和编解码器支持的情况

Browser                        MP4(H.264 + AAC)         WebM(VP8 + Vorbis )        Ogg(Theora + Vorbis)
Internet Explorer 9                    YES                      NO                       NO
Firefox 4.0                                NO                       YES                      YES
Google Chrome                       YES                      YES                      YES
Apple Safari 5                          YES                      NO                       NO
Opera 10.6                               NO                       YES                      YES

http://www.html5videoplayer.net/html5video/html5-video-browser-compatibility/
目前还没有一种编解码和容器的组合能应用于所有的浏览器中!!!

  • H.264: 别名 MPEG-4的第十部分,由MPEG研发并于2003年标准化

它的目的支持一切设备,无论是低带宽低cpu,还是高带宽高cpu 或者是两者之间。
要做到这一点,H.264标准被分成不同的几种配置。高配置使用了更多特性,
这会导致在解码过程中更加消耗CPU,但视频文件本身会更小,视频效果也更好

苹果iphone手机 基本配置(BaseLine)
正常的电视机支持 基本配置(BaseLine) 和 主配置(Main)两种
正常的电脑支持 基本配置(BaseLine) 和 主配置(Main) 高级配置(high)三种

  • 处理视频的一个流程: (tools_resource)

把压缩文件 ffmpeg.zip 放到 software 文件夹中,解压到当前文件夹,进入 bin,逐次双击运行
将 bin 加入系统环境变量
在命令行中进入 .mp4 文件所在的文件夹

  • 格式转化

用 FFmpeg 制作MP4 视频
ffmpeg -i test.mp4 -c:v libx264 -s 1280x720 -b:v 1500k -profile:v high -level 3.1 -c:a aac -ac 2 -b:a 160k -movflags faststart OUTPUT.mp4

用 FFmpeg 制作 WebM 视频
ffmpeg -i test.mp4 -c:v libvpx -s 1280x720 -b:v 1500k -c:a libvorbis -ac 2 -b:a 160k OUTPUT.webm

FFmpeg 制作 Ogg 视频
ffmpeg -i test.mp4 -c:v libtheora -s 1280x720 -b:v 1500k -c:a libvorbis -ac 2 -b:a 160k OUTPUT.ogv

FFmpeg 制作Mp3音频
ffmpeg -i test.mp3 -c:a libmp3lame -ac 2 -b:a 160k OUTPUT.mp3

FFmpeg 制作Ogg音频
ffmpeg -i test.mp3 -c:a libvorbis -ac 2 -b:a 160k OUTPUT.ogg
ffmpeg -i IDon'tWannaLiveForever.mp3 -c:a libvorbis -ac 2 -b:a 160k IDon'tWannaLiveForever.ogg


FFmpeg 制作ACC音频
ffmpeg -i test.mp3 -c:a aac -ac 2 -b:a 160k OUTPUT.aac

  • 1.制作一个Ogg容器中使用Theora视频和Vorbis音频的版本

2.制作另外一个版本,使用WebM视频容器(VP8 + Vorbis)
3.再制作一个版本,使用MP4视频容器,并使用H.264基本配置的视频和ACC低配的音频
4.链接上面3个文件到同一个video元素,并向后兼容基于Flash的视频播放器

 

猜你喜欢

转载自www.cnblogs.com/tianxiaxuange/p/9986948.html