livego+obs+flv.js 搭建視頻直播

##1、流程html

主播經過 obs軟件經過直播 -》推流到-》直播服務器

客戶經過瀏覽器 訪問站點-》flv.js拉取直播服務器視頻流並播放

##2、環境nginx

centos7git

直播服務器github

https://github.com/gwuhaolin/livego

OBSgolang

錄屏客戶端軟件

flv.jsexpress

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

播放站點npm

nginx站點

##3、流程 ##3.1 centos7 安裝livego和開啓服務json

安裝golang開發環境
git下載livego代碼
go build編譯成執行文件livego

運行 ./livegogulp

[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

視頻推送地址centos

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播放
相關文章
相關標籤/搜索