Clappr——開源的Web視頻播放器,clappr開源web

來源:互聯網
上載者:User

Clappr——開源的Web視頻播放器,clappr開源web

  巴西著名的門戶網站Globo.com(視頻播放器),使用的是基於OSMF的Flash組件。在最近幾年的發展過程中,Globo為視頻平台陸續添加了不少額外功能,例如: 字幕,廣告,畫中畫播放等。然而,由於缺乏針對視頻平台進行維護的專門小組,網站工程師之一的FlávioRibeiro越來越感覺這個平台落後和難以應付不斷增長的線上訪問需求了。特別是今年,世界盃第二次來到足球王國,Globo將面臨的是激增的賽事回放點擊。有鑒於此,Ribeiro與同事們決定對播放器進行升級改造。在進行一番驗證測試後,決定以Clappr為基礎再進行其它外掛程式功能開發。

  Clappr是一款開源可擴充的Web視頻播放器,容易上手和進行擴充並且有豐富的文檔支援。改造後,視頻流堆棧由HLS替代為RTMP,回放方式新增了HTML5直接播放。

Globo改版前的播放畫面 

增加Clappr外掛程式後的播放畫面

  Clappr架構:

  以基於組件的軟體工程理論為指導,Ribeiro團隊列出了Clappr三個主要的外掛程式:

  1.  回放外掛程式

  用於播放某個視頻資源。Clappr會遍曆所有的回放外掛程式直至找到能正確播放的外掛程式。

  2.  容器外掛程式

  每個回放都與一個容器關聯。多數情況下一個容器與一個資源回放匹配並被執行個體化。監聽事件包括播放/停止,進度條,浮水印等等。

  3.  核心外掛程式

  該部分外掛程式承載了核心控制功能。例如畫中畫功能,核心外掛程式能夠執行個體化兩個容器,在Z軸方向把次要視窗縮小播放。

Clappr架構圖

  外部外掛程式

  Clappr的外掛程式產生器能夠讓開發人員非常方便地建立自己的外部外掛程式。Ribeiro利用它建立了BemTV外掛程式,實現了基於回放-容器外掛程式的P2P統計功能。此外,Globo還推出了部分特色外掛程式,例如進度條控制,縮圖瀏覽等等。

  支援人員

  • Traceur:進行EcmaScript 6代碼編寫;
  • Browserify:進行模組化載入,類似於node的require()方式;
  • Karma、Sinon、Mocha功能測試;
  • Gulpjs::前端構建工具(建立,上傳等等)。

  除了PC端,Globo正逐步完善移動端的部署,具體請查閱iOS或Anroid。

  原文出自:Flavioribeiro

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.