一、流程

主播通过 obs软件通过直播 -》推流到-》直播服务器

客户通过浏览器 访问站点-》flv.js拉取直播服务器视频流并播放

二、环境

centos7

直播服务器

https://github.com/gwuhaolin/livego

OBS

录屏客户端软件

flv.js

https://github.com/Bilibili/flv.js/

播放站点

nginx站点

三、流程

3.1 centos7 安装livego和开启服务

安装golang开发环境

git下载livego代码

go build编译成执行文件livego

运行 ./livego

[root@localhost livego]# ./livego

2020/01/28 19:53:13 main.go:118: start livego, version master

2020/01/28 19:53:13 liveconfig.go:35: starting load configure file(.livego.json)......

2020/01/28 19:53:13 liveconfig.go:42: loadconfig:

{

  "server": [

    {

      "appname": "live",

      "liveon": "on",

      "hlson": "on"

    }

  ]

}

2020/01/28 19:53:13 liveconfig.go:49: get config json data:{[{live on on []}]}

2020/01/28 19:53:13 main.go:62: hls server enable....

2020/01/28 19:53:13 main.go:70: RTMP Listen On :1935

2020/01/28 19:53:13 main.go:105: HTTP-Operation listen On :8090

2020/01/28 19:53:13 main.go:43: HLS listen On :7002

2020/01/28 19:53:13 main.go:87: HTTP-FLV listen On :7001

视频推送地址

rtmp://192.168.199.209:1935/live

3.2 obs配置和添加视频资源

配置

添加视频源和推送

3.3 播放站点

flv.js编译flv.min.js

git下载代码库

切换到代码目录

npm install          # install dev-dependences

npm install -g gulp  # install build tool

gulp release         # packaged & minimized js will be emitted in dist folder

npm慢的解决（数据源网站太慢，可以使用淘宝提供的npm数据源）

npm install -gd express --registry=http://registry.npm.taobao.org

npm config set registry http://registry.npm.taobao.org

npm install cnpm -g

播放页面代码 index.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>课程直播</title>

</head>

<body>

    <script src="flv.min.js"></script>

    <video id="videoElement"></video>

    <script>

        if (flvjs.isSupported()) {

            var videoElement = document.getElementById('videoElement');

            var flvPlayer = flvjs.createPlayer({

                type: 'flv',

                isLive: true,

                url: 'http://192.168.199.209:7001/live/test.flv'

            });

            flvPlayer.attachMediaElement(videoElement);

            flvPlayer.load();

            flvPlayer.play();

        }

    </script>

</body>

</html>

待完善的问题

  1. google浏览器js报错，flv播放

livego+obs+flv.js 搭建视频直播的更多相关文章

  1. 使用 nginx 和 rtmp 插件搭建视频直播和点播服务器

    使用 nginx 和 rtmp 模块 ,可以很容易地搭建一个视频直播和点播服务器出来. 首先,看一下最经典的参考文献: How to set up your own private RTMP serv ...

  2. vlc+flv.js 摄像头 H5 直播

    背景 业务需求:用最短的时间搞定摄像头直播到Web页面.因为没有过这方面经验,所以走了很多弯路,其实也不算弯路吧,大部分时间花在学习基础概念,寻找快速方案中.惯性思维想当然的以为找组件,配地址就能搞定 ...

  3. 使用VLC搭建视频直播服务器

    去年我们信息之夜我们进行过视频直播服务,当时我们使用了WMS(Windows Media Server)实现了这个服务,但是编码是微软的WMV,因而像iPhone/Android这样的智能手机无法观看 ...

  4. Android中直播视频技术探究之---视频直播服务端环境搭建(Nginx+RTMP)

    一.前言 前面介绍了Android中视频直播中的一个重要类ByteBuffer,不了解的同学可以 点击查看 到这里开始,我们开始动手开发了,因为我们后续肯定是需要直播视频功能,然后把视频推流到服务端, ...

  5. SRS+flv.js打造兼容性较高的直播、点播平台

    **************************************************************************************************** ...

  6. Centos7.5 搭建Red5视频直播服务器

    一.安装java环境 yum install java-1.7.0-openjdk 详细步骤请参考 http://www.cnblogs.com/java-qzq/p/5845509.html 我的这 ...

  7. 利用Nginx搭建RTMP视频直播，点播服务器，ffmpeg推流，回看

        一.环境和工具 ubuntu 14.04 desktop 不用server的原因是一部分的演示用到了linux视频播放和直播软件,自己还要装桌面,麻烦. 不建议使用 最新的16TLS,我一开始 ...

  8. 前端视频直播技术总结及video.js在h5页面中的应用

    全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/12557070.html,多谢,=.=~ (如果对你有帮助的话请帮我点个赞啦) 目前有一个需求是在 ...

  9. flv.js的追帧、断流重连及实时更新的直播优化方案

    目录 1. 前言 2. 前端直播 2.1 常见直播协议 2.2 flv.js 的原理 2.3 flv.js 的简单使用 3. flv.js 的优化方案 3.1 追帧-解决延迟累积问题 3.2 断流重连 ...

随机推荐

  1. Git 删除大文件的方法

    git 仓库中删除历史大文件   git 仓库中删除历史大文件 在git中增加了一个很大的文件,而且被保存在历史提交记录中,每次拉取代码都很大,速度很慢.而且用删除 提交历史记录的方式不是很实际. 以 ...

  2. 2018 CCPC 吉林站 H Lovers

    2018 CCPC 吉林站 H Lovers 传送门:https://www.spoj.com/problems/LIS2/en/ 题意: q次操作 1.将第l~r个数的左边和和右边都加上一个数d, ...

  3. ABP运行Login failed for user 'IIS APPPOOL XXXXX Reason: Could not find a login matching the name provided问题解决

    我们在ABP官网上面生成解决方案后,编译完成,将数据库连接字符串中的Ip改成自己的测试数据库Ip直接在Vs里面调试运行没有任何问题. 发布之后到文件夹后运行,就报如下图异常. VS里面可以跑起来,单独 ...

  4. Apache的DBUtils框架学习(转）

    一.commons-dbutils简介 commons-dbutils 是 Apache 组织提供的一个开源 JDBC工具类库,它是对JDBC的简单封装,学习成本极低,并且使用dbutils能极大简化 ...

  5. 查漏补缺：2020年搞定SpringCloud面试（含答案和思维导图）

    前言 Spring Cloud是一系列框架的有序集合.它利用Spring Boot的开发便利性巧妙地简化了分布式系统基础设施的开发,如服务发现注册.配置中心.消息总线.负载均衡.断路器.数据监控等,都 ...

  6. .NET Core开发的iNeuOS工业互联平台，升级四大特性：配置数据接口、图元绑定数据、预警配置和自定义菜单

    目       录 1.      概述... 2 2.      演示信息... 2 3.      iNeuView(Web组态)配置数据接口... 2 4.      iNeuView(Web组 ...

  7. JIRA从8.1.0升级到8.3.0

    1.程序目录 JIRA8.1.0 安装目录(以下简称原目录): /opt/atlassian/jira-8.1.0-bak JIRA8.1.0 HOME目录(以下简称原HOME): /var/atla ...

  8. 精选腾讯技术干货200+篇，云加社区全年沙龙PPT免费下载！

    2019年已经过去,小编为大家整理了这一年以来云加社区发布的 200多篇腾讯干货,点击文章标题即可跳转到原文,请速速收藏哦~ 看腾讯技术: 腾讯成本优化黑科技:整机CPU利用率最高提升至90%: 腾讯 ...

  9. iOS定位权限请求时易犯的错误小结

    起因 用户群反馈app可能请求了不合适的定位权限:始终定位. 看到这个截图,根据经验判断可能是后台定位功能导致可能不得不请求始终定位权限.再加上之前提交审核时,苹果要求在plist文件中新增NSLoc ...

  10. 洛谷$P2053\ [SCOI2007]$修车 网络流

    正解:网络流 解题报告: 传送门$QwQ$ 一个很妙的建图,,,说实话我麻油想到$QwQ$ 考虑对每个工人建$n$个点,表示这是他修的倒数第$i$辆车,就可以算出影响是$t\cdot i$,然后对每辆 ...