4 HTML躬行记——Web音视频基础

公司目前的业务会接触比较多的音视频,所以有必要了解一些基本概念 。
文章涉及的一些源码已上传至 Github,可随意下载 。
一、基础概念本节音视频的基础概念摘自书籍《FFmpeg入门详解 音视频原理及应用》 。
1)音频
声音的三要素为频率、振幅和波形,即声音的音调、声波的响度和声音的音色 。
音频是一种利用数字化手段对声音进行录制、存放、编辑、压缩和播放的技术,相关概念包括采样、量化、编码、采样率、声道数和比特率等 。
采样是指只在时间轴上对信号进行数字化 。
量化是指在幅度轴上对信号进行数字化 。
每个量化都是一个采样,将这么多采样进行存储就叫做编码 。
声道数是指所支持的能发不同声音的音响个数,常见的有单声道、立体声道等 。
比特率,也叫码率(b/s)指一个数据流中每秒能通过的信息量 。
WebRTC 对音频的噪声抑制和回声消除做了很好的处理 。
音频格式是指要在计算机内播放或处理的音频文件的格式,是对声音文件进行数、模转换的过程,常见的有 MP3、WAV、AAC 等 。
音频信号能压缩的依据包括声音信号中存在大量的冗余度,以及人的听觉具有强音能抑制同时存在的弱音现象 。
压缩编码原理是在压缩掉冗余的信号,冗余信号是指不能被人耳感知到的信息,包括听觉范围之外以及被掩蔽掉的音频信号,压缩编码分为 2 类 。

  1. 无损压缩:熵编码,包括哈夫曼、算术和行程等编码 。
  2. 有损压缩:波形、参数、混合等编码,波形编码包括 PCM、DPCM、ADPCM、子带编码、矢量量化等 。
2)视频
视频泛指将一系列静态影像以电信号的方式加以捕捉、记录、处理、存储、传送与重现的各种技术 。
?。‵rame)是视频的一个基本概念,表示一副画面,一段视频由许多帧组成 。
视频帧又分为 I 帧、P 帧和 B ?。?
  1. I 帧是帧内编码帧,是一个完整都关键帧,无需辅助就能完整显示画面;
  2. P 帧是前向预测编码帧,是一个非完整?。枰慰记懊娴?I 帧或 P帧生成画面;
  3. B 帧是双向预测编码帧,需要参考前后图像帧编码生成 。
帧率(f/s 或 Hz)是单位时间内帧的数量,电视一般 1 秒 24 ?。÷试礁撸嬖搅鞒⒈普?。
码率即比特率(b/s),指单位时间内播放连续媒体(如压缩后的音频或视频)的比特数量,码率越高带宽消耗得就越多 。
视频格式非常多,包括视频文件格式、视频封装格式和视频编码格式等 。
视频文件格式有 MP4、RMVB、MKV、FLV、TS、M3U8 等 。FLV 是一种流媒体格式,TS 广泛应用于数字广播系统 。
M3U8 是使用 HLS 协议格式的基础,文件内容是一个播放列表(Playlist),采用 UTF-8 编码,记录了一些列媒体片段资源 , 顺序播放片段即可完整展示资源,如下所示 。
#EXTM3U#EXT-X-STREAM-INF:BANDWIDTH=150000,RESOLUTION=416x234,CODECS="avc1.42e00a,mp4a.40.2"http://example.com/low/index.m3u8#EXT-X-STREAM-INF:BANDWIDTH=240000,RESOLUTION=416x234,CODECS="avc1.42e00a,mp4a.40.2"http://example.com/lo_mid/index.m3u8#EXTINF:15.16900094256c7244451f8fd_20221020113637199.ts#EXT-X-ENDLIST其中 codecs 参数提供解码特定流所需的编解码器的完整信息 。之所以使用 ts 格式的片段是为了可以无缝拼接 , 让视频连续 。
HLS(HTTP Live Steaming,HTTP 直播流协议)的工作原理是把整个流分成一个一个的基于 HTTP 的文件来下载,每次只下载部分 。
视频封装格式也叫容器,可以将已经编码并压缩好的视频轨和音频轨按照一定的格式放到一个文件中 。
视频编码格式能够对数字视频进行压缩或解压缩的程序或设备,也可以指通过特定的压缩技术,将某种视频格式转换成另一种视频格式 。
常见的视频编码格式有几个大系列,包括 MPEG-X、H.26X 和 VPX 等 。
H.264(H.264/MPEG-4 或 AVC)是一种被广泛使用的高精度视频的录制、压缩和发布格式,H.265 是它的继任者 。
一个原始视频,若没有编码,则体积会非常大 。假设图的分辨率是 1920*1080 , 帧率为 30,每像素占 24b,那没张图占 6.22MB左右,1 秒的视频大小是 186.6MB左右,1 分钟就是 11G了 。
对原始视频进行压缩的目的是去除冗余信息,这些信息包括:
  1. 空间冗余,在图像数据中,像素间在行、列方向上都有很大的相关性 , 相邻像素的值比较接近或者完全相同 。
  2. 时间冗余,在视频图像序列中 , 相邻两帧又许多共同的地方,可采用运动补偿算法来去掉冗余 。

    推荐阅读