在相親交友原始碼中實現視訊連麥直播需要哪些步驟?

雲豹科技程式設計師發表於2021-10-19

為了滿足現代年輕人對相親交友的需求,相親交友原始碼開發了多種功能,其中視訊連麥直播就是核心功能之一,具體需要我們如何做呢?

親交友原始碼實現視訊連麥核心步驟分析

  • 遊客申請連麥/取消申請
  • 主播同意/拒絕申請
  • 音視訊釋出取消
  • 支援很多觀眾觀看
  • 支援多人連麥
  • 低延時
  • IM 彈幕

親交友原始碼視訊連麥技術端調研

大致可以分為視訊採集、編碼,傳輸,解碼,渲染等環節

所以經過調研,發現市場上已經有很多成熟的商業解決方案,並且成本很低就可以接入使用。

對比了很久,最後採用 anyRTC 公司的兩個 SDK 來完成親交友原始碼視訊連麥中的音視訊通許和信令傳輸。

信令互動

在這裡插入圖片描述
時序圖

首先利用 RTM SDK,主播和遊客端都分別加入相親交友原始碼中的同一個頻道,這樣就能實現頻道內的成員心令互動。 實現申請連麥/取消申請連麥的話,只需要和主播端約定好信令格式即可,程式碼如下。

遊客

/

/申請連麥
fun applyLine() {
        RtmManager.instance.sendPeerMessage(hostId,
            "{"cmd": "apply", "avatar": "$userAvatar", "userName": "$userNickname"}"
        )
    }
    
//取消申請連麥
fun cancelApply() {
        RtmManager.instance.sendPeerMessage( hostId,"{"cmd": "cancelApply"}"
        )
    }
//收到信令回撥通知
override fun onP2PMessageReceived(var1: RtmMessage?, var2: String?) {
            val params = JSONObject(var1.text)
            when (params.get("cmd")) {
                "acceptLine" -> {
                    //主播同意
                }
                "rejectLine" -> {
                   //主播拒絕
                }
            }
        }

主播

//拒絕遊客連麥
fun rejectLine(uid: String) {
        RtmManager.instance.sendPeerMessage(uid, "{"cmd": "rejectLine"}"
        )
    }
//同意主播連麥
fun acceptLine(uid: String) {
        RtmManager.instance.sendPeerMessage(uid, "{"cmd": "acceptLine"}"
        )
    }
    
override fun onP2PMessageReceived(var1: RtmMessage?, var2: String?) {
            val params = JSONObject(var1.text)
            when (params.get("cmd")) {
                "apply" -> {
                   //收到遊客申請連麥
                }
                "cancelApply" -> {
                   //遊客取消申請連麥
                }
            }
          
        }

以上,就完成了相親交友原始碼最簡單的信令互動,實際業務場景中,會有更多更復雜的,只需商定好,通過 RTM 傳送互動就行。

音視訊推流

在這裡插入圖片描述
時序圖

遊客只觀看主播的時候,是不需要釋出音視訊的,所以在加入相親交友原始碼房間後,將自己的身份設定為遊客(CLIENT_ROLE_AUDIENCE)即可。申請連麥並且主播同意後,再將身份設定為(CLIENT_ROLE_BROADCASTER)就會自動釋出音視訊。這樣就能與主播互動了。

anyRTC 音視訊 SDK 有2種直播模式,分別如下:

1.RTC

RTC(Real Time Communication)實時音視訊通訊,最大的特點就是延遲極低,基本都是基於 WebRTC 標準,使用私有協議進行推流的。

主播

進入相親交友原始碼視訊頁面,開啟自己的視訊並加入房間。

//初始化 SDK 引擎
RtcManager.instance.initRtc(ctx)
//開啟視訊模組
RtcManager.instance.enableVideo()
//開啟本地攝像頭設定檢視顯示
RtcManager.instance.setupLocalVideo(VideoCanvas(textureView))
//加入房間
RtcManager.instance.joinChannel(rtcToken, roomId, userId, isHost)

加入房間成功之後,如果有人申請連麥並上麥後,會收到 onUserJoin 回撥,只需要在合適的回撥中顯示移除上麥人的檢視即可。

//在這顯示上麥的人的視訊
override fun onUserJoined(uid: String?, elapsed: Int) {
          // add remote user
}
//移除他人視訊
override fun onUserOffline(uid: String?, reason: Int) {
     //remove remote user
 }

遊客

主播同意上麥申請後,應將自己的身份設定為 CLIENT_ROLE_BROADCASTER,並將自己的視訊模組開啟並新增到檢視中。

//轉換身份
RtcManager.instance.setClientRole(Constants.CLIENT_ROLE_BROADCASTER)
//新增自己的視訊
val clientTexture = RtcEngine.CreateRendererView(this)
                addVideoView(
                    binding.rlHostView,
                    clientTexture,
                    yourself = true,
                    setupLocalVideo = true
                )
                binding.apply.text = "下麥"

使用 RTC 模式實現非常的簡單,只需要關注幾個重要的回撥即可。

2.RTMP+CDN

RTMP (Real Time Messaging Protocol)是基於 TCP 的流媒體傳輸協議,最大的特點是與 CDN 的強繫結,需要藉助 CDN 的負載均衡系統將相親交友原始碼內容推送到接近使用者的邊緣節點,使使用者就近取得所需內容,提高使用者訪問的響應速度和成功率,解決因分佈、頻寬、伺服器效能帶來的訪問延遲問題。更多適用於站點加速、點播、短視訊等場景。

使用該模式比 RTC 模式程式碼要寫的多一點,因為主播端要設定上麥人的視訊合流引數,觀眾需要新增一個 AnyRTC 內建的播放器用來拉 rtmp 流。

rtmp會比RTC 延時要高一些,但是相親交友原始碼中的連麥不會,因為連麥後還是走的 RTC 模式,因此,連麥的人和主播之間的延時會很小。其他觀眾拉流的話,並不會察覺到主播和上麥者之間有什麼延遲。

主播推流到 CDN

//加入頻道成功
override fun joinChannelSuccess() {
  //設定合流引數
  publishPushLiveTranscoding()
  //新增推流地址
  RtcManager.instance.addPublishStreamUrl(cdnUrl, true)
}
private fun publishPushLiveTranscoding(
        transcodingArr: List<LiveTranscoding.TranscodingUser>,
        canvasInfo: CDNStreamLayoutInfo
    ) {
        rtcEngine?.setLiveTranscoding(LiveTranscoding().apply {
            width = canvasInfo.width
            height = canvasInfo.height
        }.apply { transcodingArr.forEach { addUser(it) } })
    }
 
//遊客上麥
override fun onUserJoin(uid: String) {
  //更新合流佈局
  updatePushLiveTranscoding()
}  
//遊客下麥
override fun onUserOffline(uid: String) {
  //更新合流佈局
  updatePushLiveTranscoding()
}

這裡需要注意的是合流佈局引數的設定。

遊客拉流播放

//建立播放器並播放主播的流
 RtcManager.instance.initMediaPlayer().apply {
            open(cdnUrl, 0)
            setView(textureView)
            play()
        }

遊客上下麥還是和上麥的流程一致,變的只是相親交友原始碼介面上的效果。以上便是“如何在相親交友原始碼中實現視訊連麥直播?”的全部內容,希望對大家有幫助。

本文轉載自網路,轉載僅為分享乾貨知識,如有侵權歡迎聯絡雲豹科技進行刪除處理
原文連結:


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69996194/viewspace-2838179/,如需轉載,請註明出處,否則將追究法律責任。

相關文章