在线直播系统网站源码搭建一个点播跟直播流媒体服务器

在线直播系统网站源码搭建一个点播跟直播流媒体服务器

在线直播系统网站源码搭建一个点播跟直播流媒体服务器

先上效果

使用OBS软件录制电脑桌面操作​推流​到自己搭建的流媒体服务器,然后在网页​拉流​播放。当然也可以采集摄像头、麦克风推流,或者推送本地视频到流媒体服务器。

在线直播系统网站源码搭建一个点播跟直播流媒体服务器_流媒体服务器

搭建步骤

Ubuntu18.04安装nginx-flv模块扩展

这里我是用虚拟机安装了Ubuntu18.04先下载nginx1.19.3的源码与nginx-http-flv-module的源码。

wget https://github.com/winshining/nginx-http-flv-module/archive/master.zip
wget http://nginx.org/download/nginx-1.19.3.tar.gz && tar -zxvf nginx-1.19.3.tar.gz
复制代码

解压下载的个源码进行编译,这样一个Nginx搭建的流媒体服务器就好了。

cd nginx-1.19.3 #进入nginx源码目录
./configure --add-module=../nginx-http-flv-module-master
vim objs/Makefile #删除-Werror
make
make install
复制代码

进行点播与直播配置

上面已经安装好了nginx,编辑/usr/local/nginx/conf/nginx.conf进行相关配置。这里直接贴出完整的配置。其中rtmp为开启rtmp服务功能,并且为了能够在网页端播放开启了hls。推流的rmtp流会转换成hls协议的ts切片,保存在服务器上,nginx配置了location让网页能够访问切好的hls切片。

这里解释下rtmp是adobe的私有协议,必须使用flash播放。hls是苹果开发的视频传输协议使用http进行传输。ios跟android支撑的都很好,一般进行跨平台直播使用hls协议比较常见。

#user  nobody;
worker_processes 1;
events {
worker_connections 1024;
}

rtmp { #RTMP服务
server {
listen 1935; #//服务端口
chunk_size 4096; #//数据传输块的大小


application vod {
play /opt/video/vod; #//视频文件存放位置。
}
application live{
live on; #直播
hls on; #把直播服务器改造成实时回发服务器,视频切片成ts
wait_key on; #对视频切片进行保护
hls_path /opt/video/rtmp/hls; #ts切片存放位置
hls_fragment 10s; #切片大小
hls_playlist_length 60s; #回看的时间
hls_continuous on; #连续模式
hls_cleanup on; #对多余切片进行删除
hls_nested on; #嵌套模式
}
}
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
location /stat { #第二处添加的location字段。
rtmp_stat all;
rtmp_stat_stylesheet stat.xsl;
}

location /stat.xsl { #第二处添加的location字段。
root /usr/local/nginx-http-flv-module/;
}
location /hls {
types {
application/vnd.apple.mpegurl m3u8;
video/mp2t ts;
}
alias /opt/video/rtmp/hls;
add_header Cache-Control no-cache;
add_header Access-Control-Allow-Origin *;
}
location / {
root html;
index index.html index.htm;
}
}
复制代码

进行测试

使用obs推流推送到rtmp://192.168.227.128/live串流密钥随便填写即可。

在线直播系统网站源码搭建一个点播跟直播流媒体服务器_流媒体服务器_02

h5网页端采用video.js进行播放直播流视频,这里的播放的地址是切好片的m3u8文件地址,m3u8存放了每一个小切片的地址。

<body>
<video id=example-video width=600 height=300 class="video-js vjs-default-skin" controls>
<source
src="http://192.168.227.128/hls/test/index.m3u8"
type="application/x-mpegURL">
</video>
<link href="//vjs.zencdn.net/7.8.2/video-js.min.css" rel="stylesheet">
<script src="//vjs.zencdn.net/7.8.2/video.min.js"></script>
<script src="videojs-contrib-hls.min.js"></script>
<script src="https://unpkg.com/browse/@videojs/http-streaming@2.2.3/dist/videojs-http-streaming.min.js"></script>
<script>
var player = videojs('example-video');
player.play();
</script>
</body>
复制代码

上面的nginx配置还配置了本地视频文件点播配置,把视频文件放在/opt/video/vod位置,使用vlc填写rtmp://192.168.227.128/vod/qlgame.mp4进行播放即可。

在线直播系统网站源码搭建一个点播跟直播流媒体服务器_nginx_03

以上搭建只是测试学习使用,实际音视频开发涉及采集、编码、推流、传输、拉流、解码等等过程,每一个过程都设计许多知识。后面音视频开发学习笔记,等我攒了一些笔记发出来互相学习。

在线直播系统网站源码搭建一个点播跟直播流媒体服务器本文转载自网络,感谢(程序员众推)的分享,转载仅为分享干货知识,如有侵权欢迎联系云豹科技进行删除处理

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/39532.html

(0)
编程小号编程小号
上一篇 2023-07-17
下一篇 2023-07-17

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注