服务器返回 m3u8 播放列表。该播放列表实时更新。一般一次给出5个数据URL。

客户端解析m3u8播放列表，然后依次请求各段的URL，获取ts数据流。

工艺简单

HLS直播延迟

我们知道hls协议将直播流分成短视频进行下载和播放，因此假设列表中包含5个ts文件，每个ts文件包含5秒的视频内容，那么整体延迟为25秒。因为当你看到这些视频的时候，主持人已经把视频录制好并上传了，所以存在由此带来的延迟。当然，可以缩短列表的长度和单个ts文件的大小以减少延迟。极端情况下，列表的长度可以减少到1，ts的持续时间可以减少到1s。但是这样会增加请求数量，增加服务器压力。当网速较慢时， 会导致更多的缓冲，因此苹果官方推荐的 ts 持续时间为 10s，因此这会造成 30s 的延迟。参考：（复制此链接并在浏览器中打开）

视频直播的整个流程是怎样的？

视频直播大致可以分为

视频录制端：一般是电脑上的音视频输入设备或者手机上的摄像头、麦克风。目前以手机视频为主。

视频播放器：可以是电脑端播放器，也可以是手机端播放器，也可以是h5标签等，目前以手机端播放器为主。

视频服务器：一般是用于接受视频录制端提供的视频源并向视频播放端提供流媒体服务的服务器。

工艺简单

如何采集音频和视频？

我们先澄清几个概念：

接下来我们将使用iOS上的摄像头来采集音视频数据，主要分为以下步骤：

音视频采集，在ios中，可以使用and采集原始音视频数据流。

视频采用 H264 编码，音频采用 AAC 编码。 iOS中有封装的编码库来对音频和视频进行编码。

将编码后的音视频数据组装成数据包；

建立RTMP连接并将其推送到服务器。

ps：由于大多数编码库都是用C语言编写的，所以使用时需要编译。对于ios，您可以使用已经编译的编码库。

x264编码：（复制此链接在浏览器中打开）

faac编码：（操作同上）

编码：（操作同上）

如果要给视频添加一些特效，比如添加滤镜，通常会在编码之前使用滤镜库，但这也会花费一些时间，并且会导致视频数据上传有一定的延迟。

工艺简单

前面提到了什么？

和之前的x264一样，它实际上是一组编码库。与Xvid类似，Xvid是基于协议的编解码器，而x264是基于H.264协议的编码器，集成了各种音视频编解码器协议。通过设置参数即可完成基于H.264等协议的编解码。这里的演示使用x264编码库。

什么是 RTMP？

Real Time（简称RTMP）是现在所属的一套视频直播协议。与HLS一样，它可以应用于视频直播。不同的是RTMP不能在iOS浏览器中播放，但其实时性能比HLS要好。因此，一般使用该协议来上传视频流，即将视频流推送到服务器。

下面是hls和rtmp的对比：

推流

所谓推流，就是将我们编码好的音视频数据发送到视频流媒体服务器。一般使用rtmp推流。可以使用第三方库-iOS来推流，它封装了一些核心API供使用。如果觉得麻烦，可以使用现成的ios视频​​流sdk，也是基于rtmp的（复制此链接在浏览器中打开）

流媒体服务器设置

一个简单的推送服务器就搭建完成了。由于我们上传的视频流是基于rtmp协议的，所以服务器也必须支持rtmp。它可能需要以下步骤：

安装服务器。

安装的rtmp扩展目前使用比较频繁（复制此链接并在浏览器中打开）

配置的conf文件：

rtmp {

{

1935;#监听端口

4000；

hls { #rtmp推送请求路径

继续生活；

开启；

/usr//var/www/hls；

5秒；

重启，写入rtmp的推送地址为rtmp://ip:1935/hls/，代表生成的.m3u8和ts文件存放的地址，代表分片时长，代表一个实例，是的名称将来要生成的文件。你可以先自己设置一个。更多配置请参考：（复制此链接并在浏览器中打开）

按照上面的步骤，一个支持rtmp的视频服务器基本已经实现了。

在页面上播放实时视频？

简单来说，可以通过标签直接播放hls协议的直播视频：

Your browser does not support HTML5 video.

 

需要注意的是，标签中添加了-属性。该属性是为了让视频在ios中全屏播放。默认情况下，ios会全屏播放视频，需要设置为YES。行业相对成熟，可以根据不同平台选择不同的策略，比如ios上使用标签，pc上使用等。

陷阱总结

基于以上步骤，作者写了一个demo，包含了从实现ios视频​​录制、采集、上传、服务器发送直播、h5页面播放直播视频的一整套流程，总结了以下几个坑：

稍后会添加一些陷阱，其中一些需要粘贴代码，但这里列出了这些。

产业支持

目前，腾讯云、百度云、阿里云都有基于视频直播的解决方案。从视频录制到视频播放和流媒体，有一系列的SDK可供使用。缺点是需要付费。如果可能的话，您可以自己实现。想要一套并不难。

演示地址：（复制此链接并在浏览器中打开）

参考：（复制此链接并在浏览器中打开）

本文为腾讯独家。转载请在文首显着位置注明作者和出处“腾讯（）”。