简单搭建一个直播服务器

全栈程序员站长

发布于 2022-09-01 16:59:35

3.4K0

发布于 2022-09-01 16:59:35

文章被收录于专栏：全栈程序员必看

大家好，又见面了，我是你们的朋友全栈君。

一、动手搭建流媒体服务器

1、下载srsv2.0_r8 ,下载地址是：https://codeload.github.com/ossrs/srs/zip/v2.0-r8

建议用迅雷下载，个人感觉比较快

2、下载下来后解压该文件（我是在我window电脑解压的）并上传

====>

使用上传工具将该文件夹上传到我的linux虚拟机中，并改名为srs

3、开始安装

进入到trunk 目录

cd /mystorage/srs/trunk
./configure
# 等上面命令执行完成，执行make编译
 make

make 编译完成也就安装完成了。

然后就是配置：

为了保证能访问到直播服务器，直接将防火墙关闭（你也可以将直播服务器端口到防火墙中配置暴露出去）

service firewalld stop

启动服务

# 前台启动方式
./objs/srs -c conf/rtmp.conf 
# 后台进程启动方法
nohup  ./objs/srs -c conf/rtmp.conf &

二、开始直播视频了

1、我们需要下载一个推流的录屏软件

https://pc.qq.com/detail/4/detail_23604.html

下载安装好后需要进行如下设置：

流密钥默认为：livestream

2、这个时候会在我们配置的hls_path生成ts和m3u9文件

3、将该资源暴露出来，就可以完成别人来观看直播了，这里我使用的是nginx代理

4、最后客户端观看直播

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>前端播放m3u8格式视频</title>
    <link href="https://vjs.zencdn.net/7.4.1/video-js.css" rel="stylesheet">
    <script src='https://vjs.zencdn.net/7.4.1/video.js'></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js" type="text/javascript"></script>
    <!-- videojs-contrib-hls 用于在电脑端播放 如果只需手机播放可以不引入 -->
</head>
<body>
    <style>
        .video-js .vjs-tech {position: relative !important;}
    </style>
    <div>
        <video id="myVideo" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" data-setup='{}' style='width: 100%;height: auto'>
            <source id="source" src="http://192.168.2.225/live/livestream.m3u8" type="application/x-mpegURL"></source>
        </video>
    </div>
</body>
 
<script>
    // videojs 简单使用
    var myVideo = videojs('myVideo', {
        bigPlayButton: true,
        textTrackDisplay: false,
        posterImage: false,
        errorDisplay: false,
    })
    myVideo.play()
    var changeVideo = function (vdoSrc) {
        if (/\.m3u8$/.test(vdoSrc)) { //判断视频源是否是m3u8的格式
            myVideo.src({
                src: vdoSrc,
                type: 'application/x-mpegURL' //在重新添加视频源的时候需要给新的type的值
            })
        } else {
            myVideo.src(vdoSrc)
        }
        myVideo.load();
        myVideo.play();
    }
  
</script>

我使用的是用迅雷影音