小程序開發進階：如何實現直播連麥

咱們上週作了一場免費在線直播課，聲網Agora 研發工程師張乾澤分享了小程序直播組件的特色、實現小程序間連麥的方法，以及須要注意的產品化難題等乾貨。本文將爲沒能觀看到直播，又正在作小程序開發的朋友們回顧一下演講內容，以及直播觀衆們提出的那些問題。（文末有視頻回顧地址，你們可配合觀看）

演講實錄

微信小程序從1.7開始，爲開發者提供了兩個新接口，和，能夠在小程序上實現單向的直播功能。經過與技術的結合，好比WebRTC，開發者們還能夠進一步在小程序直播的基礎上實現連麥功能，這也就是咱們今天要主要分享的進階經驗。

目前小程序直播連麥的應用場景有不少，好比：

首先是視頻通話。此前，該場景更多以原生應用的形態出現。如今，這兩個新的接口，讓小程序實現視頻通話成爲了可能，尤爲是在那些須要強交互、低延時的應用場景，如在線教育、企業會議等。

另外一個是在直播連麥中，具體應用場景也有不少，跨直播間 PK 就是最典型的一種。這個功能咱們能夠在熊貓直播中看到。在直播時，一個主播能夠與另外一個主播進行視頻通話，並實時直播給兩個主播的觀衆觀看。

第三個是遊戲互動，好比在線抓娃娃。用戶此前能夠經過原生應用、 PC 端瀏覽器或手機瀏覽器來玩抓娃娃，如今該場景已經擴展至小程序。

以上三種場景的共同點是，對延時、畫質要求都很高。此前以前更可能是在網頁、PC 客戶端、移動端 App 上實現這些場景，但在網頁、手機瀏覽器中比較少。而微信小程序直播組件的出現，卻改變了這個現狀，爲何呢？接下來咱們會講到。

小程序直播連麥帶來了什麼改變？

首先，若是你作過H5端實時音視頻，你應該瞭解，其中最大的問題之一就是採集。爲了解決該問題，最多見且可靠的方案就是使用 WebRTC ，由於它提供了一套接口可讓開發者在瀏覽器中獲取攝像頭、麥克風的音視頻流，在瀏覽器中實現音視頻的採集，並轉成咱們可用的數據，經過服務端推送給觀衆。

不過 WebRTC 方案也並不是萬能，它在移動端也存在不少問題須要開發者本身解決，好比：

• 兼容性問題。儘管如今新版本已經獲得了不少 PC 瀏覽器支持。可是在微信瀏覽器中，僅能在 Android 端使用。

• 用戶體驗問題。一方面，在網頁端常常咱們會收到「網頁想獲取攝像頭、麥克風權限」的提示，以容許該頁面進行音視頻的採集。不少用戶可能會選擇「拒絕」，會直接致使產品不可用。另外一方面，開發者須要保證網址是安全的，不然在一些移動應用內，好比在微信中沒法獲取攝像頭權限。

可是，這些狀況在小程序中狀況則不同。小程序提供了一套相對完善的接口。經過和兩個原生組件，能夠實現音視頻的採集、推流、拉流、播放。同時，這兩個組件還支持自帶的美顏、美白、動態分辨率調整等功能。

那麼問題來了，既然咱們已經有了這兩個組件，是否是在小程序中增長它們以後，就能夠發佈到線上直播連麥小程序，讓別人使用了呢？

答案是否認的。

你還須要搭建一個 rtmp 服務器，而後生成一個 rtmp 服務地址，利用小程序組件推流和拉流，可是這樣的產品上線仍有些距離。並且，小程序的兩個組件僅僅提供了直播功能，並不支持實現連麥。若是還想要在小程序直播中進一步實現連麥，須要解決幾方面問題：

• 可用性。若是不少人訪問你的服務器，並同時發出推流、拉流的請求，你的服務器極可能會掛掉，因此要提升可用性。

• 信令控制。就像打電話同樣，連麥雙方須要知道對方的頻道號、rtmp 地址才能互通，這就須要加入信令系統來控制。

• 互通性。好比，小程序之間如何視頻互通，小程序與原生 App 之間如何互通。

• 音視頻交互質量。好比，視頻通話的低延時、畫面與音質的清晰等。

開發者們能夠經過自研來解決以上問題，好比：

• 增長更多服務器節點，以提升可用性；
• 在增長節點以後，經過優化路由調度策略，來保證直播連麥時可繞過網絡擁塞；
• 引入信令服務器來支持連麥通話服務；
• 經過編解碼算法優化來進一步保證連麥的傳輸質量與低延時。

總之，爲了保證連麥質量，能夠優化的地方有不少。固然，若是你想直接繞過這些問題，也能夠直接使用聲網小程序直播連麥 SDK。SDK 提供了一套簡單易用的API接口，幫開發者在小程序中快速實現直播連麥功能，並支持小程序與原生App間的互通。

小程序的侷限性

咱們曾與不少開發者交流過，不少人曾提出，想在小程序直播中進行混流。例如，在小程序直播過程當中，將客戶端的音樂與直播畫面進行混流。不過目前小程序目前還不支持客戶端的混流，暫時尚未這樣的接口。但若是是小程序與原生應用連麥，咱們能夠在原生應用中進行混流，而後推流至小程序。

Q&A 環節摘錄

Q：小程序有客戶端日誌收集麼？ A：小程序自己沒有該功能。小程序自己提供一些回調方法，能夠看到推流是否開啓、分辨率、碼率等信息。用戶須要手動保存或上傳服務器。咱們在 SDK 中提供了該功能，只須要監聽日誌接口，就能夠將日誌發到回調中，用戶再經過一些方法傳到本身的服務器上。若是小程序在直播連麥中出現問題，能夠經過日誌來排查。

Q：小程序在有電話通話的同時能夠向外推流麼？ A：並不支持。小程序會經過 App.js 來管理小程序的生命週期。開發者能夠經過onShow和onHide兩個參數監聽小程序的顯示與隱藏。當有電話進來時，小程序會進入後臺，那麼直播畫面就會中止，並切換爲一張開發者預先設置好的圖片。

Q：聲網小程序SDK的支持多少人通話？ A：目前可支持最多6人同時連麥。

Q：連麥中，頭像排序如何設置？是否能夠設置主頭像在直播收看端畫面最大？ A：這涉及到畫面的佈局問題。你們能夠經過 CSS 來控制哪一個流要放大或縮小。咱們在 Sample Code 中提供了一個叫 layout.js 的文件，就是用來針對不一樣人數作不一樣佈局的文件，你們能夠參考一下。

Q：大家是否支持1080p？ A：小程序在推流時能夠經過設置最大或最小碼率動態調整分辨率，因此目前沒有有效的手段讓小程序推1080p的流。可是聲網的 SDK 在原生應用上支持1080p，在小程序與原生應用連麥時，能夠經過原生應用推送1080p的視頻流給小程序。

點擊這裏觀看回顧視頻

如遇到其它開發問題，歡迎訪問聲網 Agora問答版塊，發帖與聲網工程師交流。