基于容器環境的1-1課堂的開發部署

作者:申屠鵬會

近年來,容器化已經是業界的共識了,不僅可以減少運維的成本,也有助于進行產品的快速迭代,同時,本地也可以利用容器,搭建出和生產幾乎一樣的環境,很方便的進行開發demo或者進行小功能的測試部署。接下來,我將從產品的需求分析,設計,業務編碼,集成測試,到正式上線,利用聲網強大的SDK,全程用容器化的思想,完成一個一對一課堂軟件的開發。(因為資源關系,開發時候的容器環境只用Docker,而非K8s)。

項目介紹

疫情以來,傳統的一對一家教已經很難實現了,利用網絡進行視頻教學逐漸成為主流,但是現有的騰訊會議,ZOOM,小魚會議等平臺,側重點還是多人視頻會議的場景,對于一對一輔導教學還是有所欠缺的。因此,希望開發一個能夠支持學生和老師實時音頻互動,實時文字溝通,白板,課堂回放,作業布置,批改,屏幕共享的1對1課堂教學軟件。

需求分析

一般通過項目介紹,可以大致知道是一個怎么樣的產品。如:產品的形態是什么,用戶是什么,主要功能是什么。那么在需求分析階段,就要細化,歸類,取舍。在一般的互聯網公司,經常有的還有需求評審,有了需求,能不能實現,能不能按時完成,都是需要考慮的。但是現在我們自己做demo的化,最簡單的還是畫一個思維導圖,把功能分成幾個模塊,列一下優先級就行了。接下來就是對項目介紹的需求分析。首先,我們明確產品的形態,對于教學軟件來說,最方便的就是Web端了,只要打開瀏覽器,配備一個有攝像頭的電腦就可以開始學習,手機總歸小了一點。然后根據介紹,一對一的教學意味著還有用戶管理的功能。除此之外,最重要的就是課堂功能了,老師能夠在課堂給學生講課,錄視頻,共享桌面等功能,同時還需要和學生進行溝通,布置作業,因此還需要消息通知等功能。

那么經過以上分析,我們先做一個思維導圖,重點是功能分類。如下


image

經過分析總結,發現總共分為四個模塊,分別是課堂管理,用戶管理,白板功能,實時音視頻,根據需求分析,就可以開始進行下一步的技術選型了。

技術選型

現在的技術有很多,光編程語言就有幾十種,每種語言都有自己的框架,通信協議也有各種RPC,那么技術選型其實就是從廣泛的技術海中選取最適合自己需求的技術,需要注意的是,技術選型從來不是以技術穩定或者技術先進為標準的,而是應該找最適合的。由此,我們開始進行技術的選型。通常我會從底層開始選取,下面我制作了一個表格,以供參考。

備選技術 實現功能 理由
Golang 后端語言 能夠很方便的編譯成可執行文件,然后打包成容器服務
html等 Web前端頁面 不采用vue等框架的原因是為了快速開發體驗
Mysql 后端數據庫 開源免費,夠用就行
Redis 緩存,用戶鑒權等功能
Agora SDK 實時音視頻互動 業界最流暢最強大的音視頻SDK
騰訊云 后端服務器 提供容器部署,網關等服務。
第三方白板 白板功能

有了大致的技術選型之后,接下去就是進行架構設計。

架構設計

由于功能較少,服務大致分成了Redis緩存,Mysql數據庫,后端服務,前端服務,以及網關五個服務。架構圖畫的比較丑,如下:


image

聲網有個更好看的圖片,我也放上來:


image

對比著看的化,聲網的更加細化,尤其AgoraEdu云服務提供了不少功能,但我們自己開發的時候,用自己的服務器,那需要干的事情還是有點多的。在自己設計的架構圖里,所有Agora的SDK會被打包進前端服務里,用戶管理等模塊會屬于后端服務,兩者都是容器化的服務,之間通過https的接口進行訪問。而Mysql和Redis則提供了數據庫的功能。網關層則是一個鑒權,限流和HTTPS加密的服務。接下去就是實戰部分了。實戰我會偷點懶,會把CI/CD的省略,我會在本地編程測試完成之后再打包鏡像到服務器的Docker,如果工程量大的時候還是建議大家用持續部署的方式來做。

環境準備

盡管從這開始已經是實戰部分了,但是“磨刀不誤砍柴工”,我們可以先準備好所需的環境。

所需的開發環境:

操作系統:macos或者windows 10

編程環境:Golang

軟件:Docker

有了最基礎的幾個之后,可以開啟一些服務了。

數據庫

Docker run -d -p 3306:3306 --name mysql mysql:5.7

緩存

Docker run -d -p 6379:6379 --name redis redis:4.0

檢查環境是否都正常:


image

環境就緒后,那么接下去就是開發了。

編碼開發

在編碼過程中,我們可以先編寫后端的服務,然后有接口提供了,再編寫前端的,如此交替式編程,快速完成一個Demo。

首先我們創建兩個空文件夾,一個作為后端服務,一個作為前端服務。然后打開前端服務,新建一個Html。


image

為了方便起見,我們用CDN的方式引入Agora的SDK。

<script src="https://cdn.agora.io/sdk/release/AgoraRTCSDK-3.2.1.js"></script>

Agora提供了一個實現音視頻通話的調用過程,強烈建議閱讀一下:


image

從上往下,以教師學生為例,業務邏輯可以是這樣的:

老師通過AgoraRTC.createClient和Client.init創建本地客戶端,然后通過Client.join加入頻道。這時候可以理解為創建了一個課堂。接著通過創建本地流-播放本地流-發布本地流的過程,發送音視頻數據。

那么學生端的操作就是通過訂閱遠端流,接受音頻數據,然后進行播放。

如果要離開課堂的話,那就是通過Client.leave離開頻道。

Agora的SDK可以替我們做這些工作,是不是非常強大?

獲取SDK的權限

我們先到agora.io上注冊一下我們的項目,隨后會展示一些示例代碼,如圖:


image

我們選擇Web端,按照請求調用的路徑,我們需要先初始化一個客戶端對象,然后填入項目的APP ID和Token。同時,對于一對一視頻場景,mode設置為rtc。

可以看到我們需要傳入一個APPID和一個Token還有頻道。這些就由我們的后端提供。


image

具體邏輯為,用戶登錄之后,停留在課堂管理界面。然后新建課堂,輸入頻道號,然后點擊建立的時候,后臺返回APPID和Token,同時將課堂號存入數據庫。

Agora很貼心的列出了幾乎所有涉及的API,如下:


image

部署測試

代碼編寫完成后,就可以打包成鏡像,然后部署到服務器上,再配置一個反向代理,就能給朋友分享訪問啦,接下來我們對前端和后端分別進行打包。

對于前端來說,我們沒有用框架,因此我們可以直接用一個nginx鏡像,將其中的index替換成我們項目的index.html即可。

對于后端來說,Go可以通過:CGO_ENABLED=0 GOOS=linux GOARCH=amd64 go build main.go方便的編譯成可執行文件。我們只需要From一個空鏡像,copy編譯好的可執行文件即可。

后端Dockerfile:


image

非常簡單,只需要將編譯好的可執行文件main 用copy命令復制到容器內部某個目錄,然后等容器起來的時候運行 ./main運行即可。

體驗分享

Agora的開發者中心文檔非常全面,關鍵的地方還有最佳實踐的示例可以避免踩坑,同時,Agora提供了很多新手入門的Demo和開源項目,社區也是非常的活躍。


image

幾乎可以這么說,只要懂得基礎的編程知識,不管是初級程序員還是高級程序員,也不管是后端開發還是前端開發,都很快速的上手,如果有問題也能在開發者中心的文檔庫里搜到,這就是開發者中心最大的價值吧。

除此之外,通過Agora的demo體驗,整個音視頻的效果是出人意料的。可能很多人會覺得,不就是音視頻通話嗎,微信也有啊,QQ也有啊,甚至只要一個聊天社交軟件可能都會有視頻通話;先別說很多都用了聲網的技術,就算是微信自研的,也會發現,相同的網絡環境下,微信視頻比較模糊,延遲也會稍高,同時如果在密閉房間,回音的現象很嚴重。聲網這點做的很不錯。

除此之外,聲網也是見過SDK覆蓋最全的,


image

可以從這截圖發現,幾乎涵蓋了所有的平臺。這些細節也可以看出聲網在這方面也是投入了很多精力。

最讓人驚喜的還是注冊用戶就送超長的視頻通話時長,足夠用來做一個小范圍的音視頻直播應用了。感謝聲網。

補充

本文的例子和官網的一對一需求是差不多的,官網會更簡單些,因為有Agora云服務,提供了開箱即用的API,可以讓前端同學減少對后端的接觸——換句話說,沒有后端知識,也能夠很快速的開發一個合格的應用。

本文的目的還在于對全棧開發者有個參考,如何從需求分析到技術選型,乃至產品部署上線,用模塊化,容器化的思想快速開發一個音視頻的Demo。

本Demo在線體驗地址:https://agora.xabc.site

官方教程Demo體驗地址:https://docs.agora.io/cn/Video/1_to_1_class_overview?platform=All%20Platforms

作者網站:https://xabc.site

?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 227,428評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,024評論 3 413
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 175,285評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,548評論 1 307
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,328評論 6 404
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 54,878評論 1 321
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 42,971評論 3 439
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,098評論 0 286
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,616評論 1 331
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,554評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,725評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,243評論 5 355
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 43,971評論 3 345
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,361評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,613評論 1 280
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,339評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,695評論 2 370

推薦閱讀更多精彩內容