聲網視訊通話,視訊直播小程式 SDK 初體驗 | 掘金技術徵文

juejuea發表於2019-04-22

聲網 Agora 小程式 SDK 支援微信小程式實現功能, 並能與聲網其他 SDK 進行互通:

  • 音視訊通話
  • 音視訊直播

視訊通話 SDK 可實現一對一單聊、多人群聊,同時具備純語音通話和視訊通話功能。

視訊通話和視訊互動直播不同。視訊通話,不分主播和觀眾,所有使用者都可自由發言,預設流暢和低延時優先,畫質稍低,典型場景如多人視訊會議;互動直播,使用者區分主播和觀眾,只有主播可以自由發言,預設高畫質優先,典型場景如互動課堂。

主要功能包括伴奏混音、基礎美顏、螢幕共享、修改音視訊原始資料和自定義視訊源和渲染器等。

關鍵特性如下圖所示:

聲網視訊通話,視訊直播小程式 SDK 初體驗 | 掘金技術徵文

視訊通話支援 iOS、Android、Windows、macOS、Linux、Web、小程式,並支援平臺間互通,具體的相容性要求見下表。

詳細的產品概述可以直接看聲網開發者中心視訊通話的產品概述部分:docs.agora.io/cn/Video/pr…

本文主要是介紹一下視訊通話,視訊直播小程式 SDK 初體驗。

實現場景

結合微信小程式,能實現如下場景:

  • 線上課堂:1 對 1 及 1 對多線上小班課,老師、學生實時互動
  • 線上醫療:突破醫療資源的地域限制,實現多方視訊會診,降低診斷成本
  • 高階客服:對高價值的 VIP 客戶提供遠端視訊服務,1 對 1 實時交流
  • 遠端報警:一鍵報警,通過實時視訊通訊,為警方提供一手現場情況
  • 銀行開戶:實時視訊認證,清晰畫質、超低延時、隱私保護,提升開戶效率

技術方案

小程式連麥的聲網實現架構圖如下所示:

聲網視訊通話,視訊直播小程式 SDK 初體驗 | 掘金技術徵文

從上面這個小程式連麥實現架構圖中我們可以看出:

  1. 在大網邊緣節點部署協議轉換服務對小程式端發出的 RTMP 流進行轉換;
  2. 將轉化後的 UDP 傳輸到 Agora SD-RTN 上;
  3. 通過 Agora SD-RTN 與 Agora 其他平臺 SDK 實現音視訊互通。

小程式 SDK 初體驗

首先要準備好本地的開發環境:

  1. 確保本地已安裝微信開發者工具
  2. 確保有一個支援 live-pusher 和 live-player 元件的微信公眾平臺賬號。只有特定行業的認證企業賬號才可使用這兩個元件。詳情請點選這裡
  3. 確保在微信公眾平臺賬號的開發設定中,給予以下域名請求許可權:

一開始我在做本地測試的時候沒有認真看官方文件,沒有為上述域名設定請求許可權,調了好久。

執行 Demo 程式

  1. 在 Agora.io 註冊賬號,並建立自己的測試專案,獲取 App ID。如需獲取 Token 或 Channel Key,請啟用 App Certificate

  2. 下載示例程式程式碼

  3. 開啟 utils 資料夾,在 config.js 檔案中填入獲取到的 App ID:

const APPID = "";

if(APPID === ""){
  wx.showToast({
    title: `請在config.js中提供正確的appid`,
    icon: 'none',
    duration: 5000
  });
}

module.exports = {
  APPID: APPID
}
複製程式碼
  1. 下載 Agora Miniapp SDK,並將 SDK 重新命名為 “mini-app-sdk-production.js"

  2. 將更名後的 "mini-app-sdk-production.js" 檔案儲存在本示例程式的 lib 資料夾下

  3. 啟動微信開發者工具並匯入該示例程式

  4. 輸入頻道名,加入頻道。邀請你的朋友加入同一個頻道,就可以開始視訊互通了。

注意

如果啟用了 App Certificate,還需要在服務端生成 Token 或 Dynamic Key 用於鑑權。將生成的 Token 或 Dynamic Key 填入如下方法中:

//...
client.join(<your key/access token here>, channel, uid, () => {
//...
複製程式碼

線上體驗

除了 SDK,聲網也提供了線上體驗小程式 Demo。

在 Android 或 iOS 上開啟微信 App, 掃描識別下面的二維碼,即可快速體驗 Agora 小程式解決方案。

聲網視訊通話,視訊直播小程式 SDK 初體驗 | 掘金技術徵文

在小程式介面上輸入你想要進入的房間名,點選 加入房間 即可進入小程式頻道。

其他使用者在自己的小程式上輸入相同的房間名,點選 加入房間,即可進入相同的頻道,實現通話。

你還可以點選螢幕上的按鈕,依次體驗 靜音、切換攝像頭、美顏 等功能。

前文也說過,視訊通話支援 iOS、Android、Windows、macOS、Linux、Web、小程式,並支援平臺間互通。可以說做得很完善了,用起來還是很方便的,給團隊贊一個。


Agora SDK 使用體驗徵文大賽 | 掘金技術徵文,徵文活動正在進行中

相關文章