資訊專欄INFORMATION COLUMN
摘要：一的直播答題時什么的直播答題主要發生在三個環境下端移動瀏覽器和微信端，微信端包括微信瀏覽器和微信小程序。除了要注意部署邊緣節點，轉碼和中繼也需要部署邊緣幾點，所以微信端直播與答題的同步問題會加重。
各大平臺為了給自家的直播答題爭搶流量，已經絞盡腦汁，不斷在玩法上進行創新。這場競爭從 iOS 平臺蔓延至 Android 平臺。目前大多數平臺獲取用戶的方式還是通過分享邀請碼，下載 App 的方式進行。不禁有前端開發者問道，難道直播答題就沒有 H5 什么事么？
H5 實現直播答題真的不可能么？本文我們試著探討 H5 實現直播答題的可能。
一、H5 的直播答題時什么？H5 的直播答題主要發生在三個環境下：PC 端、移動瀏覽器和微信端，微信端包括微信瀏覽器和微信小程序。其實目前已經有兩個直播平臺在開發了直播答題小程序，這么做的好處是什么呢？
1.用戶參與門檻低。
目前用戶都是在掃碼之后，需要先跳轉到 App Store 下載應用。如果是像沖頂大會一樣的獨立 App 還好，如果是屬于直播平臺，則用戶還需要再多一步才能進入游戲。做產品的人都知道，注冊步驟越多，用戶流失率越高。如果我們讓用戶掃碼后，在 H5 端登錄，可以讓他率先參與游戲，成為你的用戶。相對于其它競爭對手，可以更快讓新用戶參與進來。
2.傳播更便利。
H5 的形態更易于傳播，再加上幾乎零門檻的參與方式，更容易吸引、搶奪新用戶。如果開發的是小程序，通過在微信 9.3 億的月活用戶中分享，會產生裂變式的傳播。
不過H5的直播答題也有弊端。H5 不具備通知的功能。在獲得用戶之后，我們還需要通過一些運營手法才能進一步留住他們，例如登錄 App 可獲得更多復活機會等，在這方面就見仁見智了。
二、開發H5直播答題的難點是什么？H5 直播答題的難點主要有兩個：
視頻與答題同步
服務穩定
1.視頻和視頻的同步
在一個月前，Native App 上的視頻與答題同步就曾是個很大的問題，在 H5 端也會是主要難點之一。因為音視頻流與題目是分別通過兩套系統發送至 H5 端，兩者本身的端到端延時不同，到達后如何讓題目在主持人發出命令時就顯示出來，是一個問題。如果想做到同步，目前最通用的方法就是加時間戳，但 CDN 本身不支持，需要開發者進行二次深度開發。所以在一個月前，為了搶先上線的第一批直播答題應用，當時都出現了不同程度的答題與直播不同步問題。
在微信端則稍有不同。由于微信瀏覽器對視頻、音頻格式兼容問題嚴重。而且微信瀏覽器目前對 H.264兼容不夠好。所以你還需要進行一次轉碼，很多原始碼流上的標簽或者 SEI 數據都要轉譯一次。這就增加了實現直播與答題同步的復雜度。
2.服務穩定
由于直播答題開播時在短時間內會產生高并發，你需要注意節點部署，在骨干網絡擁塞時，進行規避。
我們下面來看看基本的解題思路。對 PC Web 和移動瀏覽器的觀眾來講，我們可以直接通過 CDN 方案實現。需要特別關注的有兩點：一是要關注邊緣節點的部署以及弱網環境的傳輸，二就是直播與題目的同步。基本原理如下圖所示。對于非微信瀏覽器的觀眾，需要在本地進行解碼、渲染，然后進行播放。當然，還有另一種選擇，就是通過 Agora Web SDK 直接實現，無需擔心若干服務端傳輸、設備適配、回聲、可用度等問題，而且支持海量高并發，完美解決直播與題目同步問題。
微信端有些不同，我們可以通過下圖對比發現。在微信端中打開的的觀眾，直播流需要進行一次 MPEG1 轉碼，然后再通過中繼 Server 將視頻分發到微信端，通過 JSMpeg 解碼播放。之所以使用 JSMpeg，是由于它體積小，且可以在大多數瀏覽器上順暢運行。
不過需要注意的是，微信端用戶得到的數據經過 CDN 后，還會通過轉碼 Server、中繼 Server，對于開發者來講不僅又是一筆額外的成本，而且經過轉碼 Server、中繼 Server 后，還會放大端到端的延時。除了 CDN 要注意部署邊緣節點，轉碼 Server 和中繼 Server 也需要部署邊緣幾點，所以微信 H5 端直播與答題的同步問題會加重。
如果說開發 Native 是直播答題應對目前快速競爭的“捷徑”，那么開發 H5 就是獲取裂變式傳播新途徑。
如果你細心觀察會發現，現在后入局的一些直播答題廠商與去年直播抓娃娃的廠商有較高重合度。在抓娃娃風口時，H5 是很多廠商的首選，但是當下直播答題風口卻還未出現強需求。我們分析可能出于兩個原因：一是，H5抓娃娃參與門檻雖然低，但是流失率高，所以在新風口鮮有人嘗試；二是，微信小程序現在已經開放了音視頻接口，開發者可能會首選小程序，但現在小程序的直播權限仍有準入限制，所以發布直播答題小程序的并不多。
原文刊載于聲網Agora微信公眾號（ID:shengwang-agora）
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/107094.html
摘要：再來做個練習，如果我們想要黃色，那就是把紅色光跟綠色光混合起來，所以我們就把紅色光跟綠色光像這樣開到最大，你就能夠看到黃色了。 網頁使用到的色彩標示方法中，從古早時期大家都在用的16進位碼（#000000）、RGB色值標示、HSL色彩標示，其中網頁設計師最常使用的16進位色碼標示法，而16進位碼又是如何計算色彩的呢？有沒有辦法直接腦袋就把色彩算出來？HSL色彩該如何運用與記憶？有沒有什...
摘要：再來做個練習，如果我們想要黃色，那就是把紅色光跟綠色光混合起來，所以我們就把紅色光跟綠色光像這樣開到最大，你就能夠看到黃色了。 網頁使用到的色彩標示方法中，從古早時期大家都在用的16進位碼（#000000）、RGB色值標示、HSL色彩標示，其中網頁設計師最常使用的16進位色碼標示法，而16進位碼又是如何計算色彩的呢？有沒有辦法直接腦袋就把色彩算出來？HSL色彩該如何運用與記憶？有沒有什...
摘要：數據分析的發展方向一般有商業方向，行業分析業務方向，和機器學習數據挖掘方向。機器學習的書籍推薦統計學習方法，機器學習，機器學習實戰三本書。 作者：xiaoyu 微信公眾號：Python數據科學 知乎：python數據分析師 上一篇主要分享了博主親身轉行數據分析的經歷： 【從零學起到成功轉行數據分析，我是怎么做的？】 本篇繼上一篇將分享轉行數據分析的一些經驗和學習方法，看完這篇你將會解...
閱讀 2954·2021-11-17 09:33
閱讀 3118·2021-11-16 11:52
閱讀 482·2021-09-26 09:55
閱讀 2975·2019-08-30 15:52
閱讀 1313·2019-08-30 15:44
閱讀 1257·2019-08-30 13:59
閱讀 796·2019-08-30 13:08
閱讀 1157·2019-08-30 10:50
