每周一期的前端周刊来也~
hls.js is a JavaScript library which implements an HTTP Live Streaming client. It relies on HTML5 video and MediaSource Extensions for playback.
A reference client implementation for the playback of MPEG DASH via Javascript and compliant browsers.
流媒体（streaming media）是指将一连串的媒体数据压缩后，经过网上分段发送数据，在网上即时传输影音以供观赏的一种技术与过程，此技术使得数据包得以像流水一样发送；如果不使用此技术，就必须在使用前下载整个媒体文件。流式传输可传送现场影音或预存于服务器上的影片，当观看者在收看这些影音文件时，影音数据在送达观看者的计算机后立即由特定播放软件播放
传输的网络协议
- 实时传输协议RTP
- 实时传输控制协议RTCP
- 实时流协议RTSP
- 原始视频文件 => 编码器 => 媒体服务器集群
- 播放器 => 流媒体协议 => 媒体服务器集群
HTTP Live Streaming
- HLS 协议由三部分组成：HTTP、M3U8、TS。
- Apple 的 Safari 浏览器直接就能打开 m3u8 地址。
- HTTP 是传输协议
- M3U8 是索引文件
- TS 是音视频的媒体信息（视频的封装格式是TS。）
- 视频的编码格式为H264
m3u8 文件是用文件方式对媒体文件进行描述，由一些列标签组成。
- 单码率适配流
- 多码率适配流
顶级 m3u8 文件主要是做码率适配的，二级 m3u8 才是真正的切片文件，客户端会默认选择码率最高的请求，如果发现码率达不到，会请求降低码率的流
- 一个 m3u 的 Playlist 就是一个由多个独立行组成的文本文件，每行由回车/换行区分。
- 每一行可以是一个 URI、空白行或是一个 以 "#" 号开头的字符串，并且空格只能存在于一行中不同元素间的分隔。
- 将一个视频码流转换另一个视频码流
- 以适应不同的网络带宽，不同的终端处理能力和不同的客户需求。
- 点播系统中的转码一般是离线转码，直播系统中的转码为即时转码。
视频编码方式就是指通过特定的压缩技术，将某个视频格式的文件转换成另一种视频格式文件的方式。
- 国际电联 -- H.264
- 运动静止图像专家组 -- M-JPEG
- 国际标准化组织运动图像专家组 -- MPEG
- 微软公司 -- WMV (.asf和.wmv)
- Real-Networks -- RealVideo (.rm、.ra、.rmvb)
- Apple -- QuickTime (.mov)
- google -- WebM
联合国下属的组织
- ITU-T是ITU的一部分
- 国际电信联盟远程通信标准化组织(ITU-T for ITU Telecommunication Standardization Sector)，国际电信联盟管理下的专门制定远程通信相关国际标准的组织
- 它制定的标准有H.261、H.263、H.263+
- H - 视频音频以及多媒体系统复合方法
- H.223 低码率多媒体通信复合协议
- H.225.0 也被称为实时传输协议
- H.261 视频压缩标准, 约1991年
- H.262 视频压缩标准(和MPEG-2第二部分内容相同), 约1994年
- H.263 视频压缩标准, 约1995年
- H.263v2 (也就是 H.263+) 视频压缩标准, 约1998年
- H.264 视频压缩标准(和MPEG-4第十部分内容相同), 约2003年
- H.323 基于包传输的多媒体通信系统
ITU-T VCEG是Video Coding Experts Group的简称，也直接可称为VCEG，中文可以翻译成视频编码专家组。VCEG的官方头衔为ITU-T SG16 Q.6。VCEG开发制定了一系列视频通信协议和标准，包括H.261视频会议标准，和其后续版本H.263、[[H.263+]]、[[H.263++]]等。最新的标准是H.264（早期命名为H.26L）。H.264和ISO/IEC MPEG-4 Part 10是VCEG和MPEG合作共同发布的标准。 2013年2月，H.265版本也已发布。
- 国际标准化组织
- 它制定的标准有MPEG-1、MPEG-2、MPEG-4等。并且已经制定出来了最新的MPEG-7，并且计划公布MPEG-21
- Moving Pictures Experts Group
- 该专家组成立于1988年，致力于运动图像及其伴音的压缩编码标准化工作，原先他们打算开发MPEG1、 MPEG2、MPEG3和MPEG4四个版本，以适用于不同带宽和数字影像质量的要求。
由ITU-T 的VCEG（视频编码专家组）和ISO/IEC 的MPEG（活动图像编码专家组）联合组建的联合视频组（JVT：joint video team）提出的一个新的数字视频编码标准，它既是ITU-T 的H.264，又是ISO/IEC 的MPEG-4 的第10 部分。而国内业界通常所说的MPEG-4 是MPEG-4 的第2 部分。
数据传输时单位时间传送的数据位数，一般我们用的单位是kbps即千位每秒。通俗一点的理解就是取样率，单位时间内取样率越大，精度就越高，处理出来的文件就越接近原始文件。
码率(kbps)=文件大小(KB) * 8 / 时间(秒)
- 码率和质量成正比，但是文件体积也和码率成正比。
- 码率超过一定数值，对图像的质量没有多大影响。
- Kbps：ps指的是/s，即每秒。Kbps指的是网络速度，也就是每秒钟传送多少个千位的信息（K表示千位，Kb表示的是多少千个位），为了在直观上显得网络的传输速度较快，一般公司都使用kb（千位）来表示。1KB/S=8Kbps。ADSL上网时的网速是512Kbps,如果转换成字节，就是512/8=64KB/S(即64千字节每秒）。
- 一般来说，如果是1M的宽带，在网上只能看不超过1024kbps的视频，超过1024kbps的视频只能等视频缓冲才能流畅的观看。
- Blob 对象表示一个不可变、原始数据的类文件对象。
- Blob 表示的不一定是JavaScript原生格式的数据。
- File 接口基于Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。
- URL.createObjectURL() 静态方法会创建一个 DOMString，其中包含一个表示参数中给出的对象的URL。
- 这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象。
objectURL = URL.createObjectURL(object);
参数 object -- 用于创建 URL 的 File 对象、Blob 对象或者 MediaSource 对象。
HTMLVideoElement => HTMLMediaElement => HTMLElement => Element => Node => EventTarget
- HTMLVideoElement 接口提供了用于操作视频对象的特殊属性和方法。
- 它同时还继承了HTMLMediaElement 和 HTMLElement 的属性与方法。
- height 以CSS pixels的单位给出了显示区域的大小。
- poster 用于指定当视频无法播放时需要展示的图片。
- videoHeight 只读 返回一个unsigned long 值，以CSS pixels的单位给出视频资源的实际高度。这个值考虑了大小、对比度、明度、分辨率等，是由视频资源本身确定的。如果这个元素的ready state是 HAVE_NOTHING，这个属性的值为0。
- videoWidth 只读 返回一个unsigned long 值，以CSS pixels的单位给出视频资源的实际宽度。这个值考虑了大小、对比度、明度、分辨率等，是由视频资源本身确定的。如果这个元素的ready state是 HAVE_NOTHING，这个属性的值为0。
- width 以CSS pixels的单位给出了显示区域的大小。
事件
- loadstart
- durationchange
- loadedmetadata
- loadeddata
- progress
- canplay
- canplaythrough