写在开始
小程序升级实时音视频录制及播放能力,开放wi - fi、NFC (HCE)等硬件连接功能。同时提供按需加载,自定义组件和更多访问层级等新特性,增强了第三方平台的能力,以满足日趋丰富的业务需求。
为更高效地连接用户与商家,小程序提供了实时音视频录制及播放组件。符合类目要求的小程序自助开通后,可自建或使用云服务,实现单向,双向甚至多向的音视频功能,如在线授课,远程咨询,视频客服,以及多人会议等。
2017-12-26微信小程序推送了这样一条消息,文档,代码也是简单的一笔带过,用户需要自建或使用云服务,实现单向,双向甚至多向的音视频功能。目前仅支持flv, rtmp格式。
本篇博客通过介绍使用nginx的rtmp模块来使nginx服务支持rtmp协议,可以完成推流和播放的功能。
开发环境
Linux (centos7), Nginx (openresty) nginx-rtmp-module
安装
由于之前已经安装过了openresty,详见博文。这里我们只需要安装nginx-rtmp-module模块即可。
下载并解压模块:
<代码> wget https://github.com/arut/nginx-rtmp-module/archive/master.zip 解压缩master.zip 代码>
停止原来的Nginx服务:
<代码> nginx - s停止代码>
配置并编辑:
<代码>。/配置——添加模块=/home/nginx-rtmp-module-master 使代码>
复制Nginx:
<代码> # #路径根据自己软件路径自行配置 cp/home/openresty/build/nginx-1.11.2 obj/nginx/usr/local/openresty/nginx/sbin 代码>
配置rtmp服务:
<代码> rtmp {# rtmp服务 服务器{ 听1935;#//服务端口 chunk_size 4096;#//数据传输块的大小 应用视频点播{ 播放/opt/视频;#//视频文件存放位置。 } 应用生活{#直播 住alt=" Nginx学习之配置RTMP模块搭建推流服务">回看
实时回看视频服务器的配置:
<代码>事件{ 使用epoll; #选择epoll模型可以达到最佳的IO性能 worker_connections 1024; } rtmp {# rtmp服务 服务器{ 听1935;#//服务端口 chunk_size 4096;#//数据传输块的大小 应用视频点播{ 播放/opt/视频;#//视频文件存放位置。 } 应用生活{#直播 住url=" rtmp://ip端口/生活/itstyle” 模式="高清" autopush=" true " bindstatechange=" statechange " 美=" 10 " 白度=" 10 "/在代码>手机打开小程序页面,进行视频推流服务,稍后我们会在/opt/视频/hls/itstyle目录下发现一些ts文件和index.m3u8文件。
注意url中的itstyle可以随便定义,相当于一个房间标识。
电脑推流
电脑直播是在个人电脑(windows/mac)上借助安装的推流软件突发交换(推荐)或者XSplit向RTMP视频云的推流地址,推送经过压缩编码现场活动,教学,投影或者游戏等画面,同时观众可以通过和推流地址相对应的播放地址收看实时画面。
电脑直播流程非常简单,主要步骤:
-
<李>通过RTMP自定义一个推流地址,解决往哪推流的问题,李>
<李>采用第三方的推流软件,设置推流音视频源以及编码参数,解决推什么内容的问题,李>
<李>观众就可以使用我们提供的RTMP演示通过设置播放地址即可进行观看,解决内容触达到观众那里的问题。李>
推荐第三方推流工具使用指南
Web播放
xiaozhibo.html:
<代码类=" language-html "> & lt; !DOCTYPE html> & lt; html lang=皕h-cmn-Hans”比; & lt; head> & lt;元http-equiv=癤-UA-Compatible”内容=癐E=边缘”/比; & lt;元http-equiv=? type”内容=" text/html;charset=utf - 8”比; & lt;元name=笆哟啊蹦谌?翱矶?设备宽度,初始=1,最大范围=1,user-scalable=不,shrink-to-fit=不”比; & lt; title>小直播& lt;/title> & lt;元名称=肮丶省蹦谌?氨? & lt;元name=懊枋觥蹦谌?靶≈辈ァ辈シ窒怼北? & lt;元名称=癴ormat-detection”内容=暗缁?不”比; & lt;元名称=癮pple-mobile-web-app-capable”内容=笆恰北? & lt;元名称=癮pple-mobile-web-app-status-bar-style”内容=昂谏北? & lt;元名称=癿sapplication-tap-highlight”内容=安弧北? & lt;脚本src=" https://www.yisu.com//imgcache.qq.com/open/qcloud/video/vcplayer/TcPlayer-2.2.1.js " charset=皍tf - 8”祝辞& lt;/script> & lt;/head> & lt; body> & lt; div id=" id_test_video "祝辞& lt;/div> & lt;脚本type=" text/javascript祝辞 var=new TcPlayer球员(id_test_video, { “m3u8”:“http://rtmp.52itstyle.com/live/itstyle002/index.m3u8”, “播放”:真的,//iOS下safari浏览器,以及大部分移动端浏览器是不开放视频自动播放这个能力的 “coverpic”:“https://blog.52itstyle.com/usr/uploads/2017/12/2652725976.jpg”, “宽度”:' 480 ',//视频的显示宽度,请尽量使用视频分辨率宽度 “高度”:‘320’//视频的显示高度,请尽量使用视频分辨率高度 }); & lt;/script> & lt;/body> & lt;/html>Nginx学习之配置RTMP模块搭建推流服务