surging 基於流媒體服務如何叢集分流

fanly11發表於2021-05-10

前言

最近幾年微服務可謂是大火，大家忙著建設微服務，學習微服務如何搭建，微服務技術體系的演變也使得企業公司能支援起靈活，多樣化的業務需求和越來越多的訪問量，有很多企業使用者正在朝著業務中臺，SAAS雲平臺進行發展，並能與時俱進跟上技術時代的腳步。而這篇文章呢，主要是講解一下流媒體服務如何叢集分流，附帶講解一下surging 特有的一些功能。

 

微服務特點

 

 

6個典型特點

1.高內聚，低耦合：程式模組的可重用性、移植性大大增強，針對於介面和業務模組的不同部署就能做到本地和遠端呼叫；

2.單一職責：只負責某一業務功能；

3.獨立：每個服務可以獨立的開發、測試、構建、部署；

4. 靈活性：小而靈活可以滿足開發不同型別的業務模組。

5.程式隔離：可以通過隔離，發生熔斷，雪崩而不會影響其它服務呼叫和執行

6.多樣性： 針對於協議的擴充套件可以支援多樣化業務場景的解決方案。

部件和功能

通過上圖發現，surging 可以支援以下功能：

1.可以支援web,移動端,物聯網和流媒體等業務場景

2.可以支援rtmp ,http-flv,thrift,mqtt,ws,http,grpc 多種協議以滿足不同業務的場景的需要

3,可以支援服務之間呼叫的鏈路追蹤。

4.可以支援掃描模組引擎，cli 工具，任務排程服務，日誌，swagger 文件，服務註冊，服務發現，協議主機，快取中介軟體，事件匯流排等功能。

例項

 

 

 

下面以上圖流媒體叢集分流的例子，看看是如何研發執行的。

 以部署兩臺服務提供者為例，服務A，通過下載surging企業版（非商業使用者不能用於商業，只能用於學習），通過以下配置來修改surgingSettings.json檔案

 {
 "Surging": {
 
    "Port": "${Surging_Server_Port}|81",
     
    "Ports": {
      "HttpPort": "${HttpPort}|28",
      "WSPort": "${WSPort}|96",
      "MQTTPort": "${MQTTPort}|97",
      "GrpcPort": "${GrpcPort}|95"
    }，
  "LiveStream": {
    "RtmpPort": 77, //rtmp 埠
    "HttpFlvPort": 8081, //HttpFlv 埠
    "EnableLog": true, //是否啟用log
    "EnableHttpFlv": true,
    "RouteTemplate": "live1", //直播服務路由規則名稱，可以根據規則設定，比如叢集節點2，可以設定live2, 叢集節點3，可以設定live3
    "ClusterNode": 2 //叢集節點數裡，會根據routetemplate 轉推流
  }
}

 

服務B，通過以下配置來修改surgingSettings.json檔案

 {
 "Surging": {
 
    "Port": "${Surging_Server_Port}|82",
     
    "Ports": {
      "HttpPort": "${HttpPort}|281",
      "WSPort": "${WSPort}|961",
      "MQTTPort": "${MQTTPort}|971",
      "GrpcPort": "${GrpcPort}|951"
    }，
  "LiveStream": {
    "RtmpPort": 76, //rtmp 埠
    "HttpFlvPort": 8080, //HttpFlv 埠
    "EnableLog": true, //是否啟用log
    "EnableHttpFlv": true,
    "RouteTemplate": "live1", //直播服務路由規則名稱，可以根據規則設定，比如叢集節點2，可以設定live2, 叢集節點3，可以設定live3
    "ClusterNode": 2 //叢集節點數裡，會根據routetemplate 轉推流
  }
}

然後可以通過ffmpeg或者obs進行推流，以ffmpeg 工具為例，可以輸入以下命令

ffmpeg -re -i D:/大H包.HDTC1280高清國語中字版.mp4 -c copy -f flv rtmp://127.0.0.1:76/live1/livestream2

通過以下程式碼我們建立httpflv 的html 檔案，url配置為：http://127.0.0.1:8080/live1/livestream2 

<!DOCTYPE html>
<html>

<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <title>flv.js demo</title>

    <style>
        .mainContainer {
            display: block;
            width: 1024px;
            margin-left: auto;
            margin-right: auto;
        }

        .urlInput {
            display: block;
            width: 100%;
            margin-left: auto;
            margin-right: auto;
            margin-top: 8px;
            margin-bottom: 8px;
        }

        .centeredVideo {
            display: block;
            width: 100%;
            height: 576px;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: auto;
        }

        .controls {
            display: block;
            width: 100%;
            text-align: left;
            margin-left: auto;
            margin-right: auto;
            margin-top: 8px;
            margin-bottom: 10px;
        }

        .logcatBox {
            border-color: #CCCCCC;
            font-size: 11px;
            font-family: Menlo, Consolas, monospace;
            display: block;
            width: 100%;
            text-align: left;
            margin-left: auto;
            margin-right: auto;
        }
    </style>
</head>

<body>
    
    <div class="mainContainer">
        <video name="videoElement" class="centeredVideo" id="videoElement" controls width="1024" height="576" autoplay>
            Your browser is too old which doesn't support HTML5 video.
        </video>

    </div>

    <script src="https://cdn.bootcdn.net/ajax/libs/flv.js/1.5.0/flv.min.js"></script>
    
    <script>
        (function () {
            if (flvjs.isSupported()) {
                startVideo()
            }

            function startVideo() {
                var videoElement = document.getElementById('videoElement');
                var flvPlayer = flvjs.createPlayer({
                    type: 'flv',
                    isLive: true,
                    hasAudio: true,
                    hasVideo: true,
                    enableStashBuffer: false,
                    url: 'http://127.0.0.1:8080/live1/livestream2'
                });
                flvPlayer.attachMediaElement(videoElement);
                flvPlayer.load();
                window.setTimeout(function () { flvPlayer.play(); }, 500);

            }

            videoElement.addEventListener('click', function () {
                alert('是否支援點播視訊：' + flvjs.getFeatureList().mseFlvPlayback + ' 是否支援httpflv直播流：' + flvjs.getFeatureList().mseLiveFlvPlayback)
            })

            function destoryVideo() {
                flvPlayer.pause();
                flvPlayer.unload();
                flvPlayer.detachMediaElement();
                flvPlayer.destroy();
                flvPlayer = null;
            }

            function reloadVideo() {
                destoryVideo()
                startVideo()
            }
        }) (document)
    </script>
    
</body>

</html>

然後就可以通過開啟建立的html檔案，執行效果如下圖

 

 通過potplay 配置服務A,連結為：rtmp://127.0.0.1:77/live1/livestream2，然後如下圖所示：

 

 

 可以通過potplay 配置服務B,連結為：rtmp://127.0.0.1:76/live1/livestream2，然後如下圖所示：

 結尾

通過此篇文章我們瞭解surging ，也瞭解如何播放httpflv ，如何針對於rtmp 推流轉推到其它服務上進行訂閱播放，後期計劃打算支援rtsp 協議，也請各大使用者和企業使用者多多關注。

相關文章