摘要：所以，支持自定義的新版應(yīng)運而生。組件的實現(xiàn)方式，用戶如何快速自定義開發(fā)組件提供了兩種方式讓用戶去開發(fā)自己的播放器組件的類型定義一個組件當您的項目是使用的語法，通過或者構(gòu)建時，建議使用這種方式。

摘要： Aliplayer希望提供一種方便、簡單、靈活的機制，讓客戶能夠擴展播放器的功能，并且Aliplayer提供一些組件的基本實現(xiàn)，用戶可以基于這些開源的組件實現(xiàn)個性化功能，比如自定義UI和自己App server的交互等等，而不用從頭開始開發(fā)一些功能，節(jié)省時間和精力。

阿里云播放器SDK（ApsaraVideo for Player SDK）是阿里視頻云端到云到端服務(wù)的重要一環(huán)，除了支持點播和直播的基礎(chǔ)播放功能外，還深度融合視頻云業(yè)務(wù)，支持視頻的加密播放、安全下載、首屏秒開、低延時等業(yè)務(wù)場景，為用戶提供簡單、快速、安全、穩(wěn)定的視頻播放服務(wù)。

Aliplayer Web播放器分為H5和Flash兩個，F(xiàn)lash播放器隨著技術(shù)的發(fā)展會逐漸被邊緣化，而H5播放器會更加普及。播放器端上已經(jīng)實現(xiàn)了截圖、國際化、變速、UI自定義、微信同層播放、自適應(yīng)播放、加密播放、H5播放flv、自定義插件等功能。

雖然Aliplayer已經(jīng)具備相對完善的公共基礎(chǔ)能力，但是用戶會有一些更上層和業(yè)務(wù)相關(guān)的一些需求，并且基于用戶本身的需求都會存在個性化差異，比如彈幕、跑馬燈、視頻列表等等。

因此，Aliplayer希望提供一種方便、簡單、靈活的機制，讓客戶能夠擴展播放器的功能，并且Aliplayer提供一些組件的基本實現(xiàn)，用戶可以基于這些開源的組件實現(xiàn)個性化功能，比如自定義UI和自己App server的交互等等，而不用從頭開始開發(fā)一些功能，節(jié)省時間和精力。所以，支持自定義的新版Aliplayer應(yīng)運而生。

Aliplayer希望有一種很簡單的方式去定義組件，讓用戶的學(xué)習(xí)成本近乎于零。因此定義出整個播放器的生命周期的重要階段，作為函數(shù)鉤子，用戶可以通過函數(shù)鉤子實現(xiàn)每個階段的自定義邏輯，下面的圖列出了主要生命周期，標示在函數(shù)的周期內(nèi)會發(fā)生的一些階段：

組件系統(tǒng)特點：

1、 實現(xiàn)簡單：用戶只要有前端的基本知識，就可以開發(fā)一個插件，并且支持ES5和ES6的語法，只要定義一個Function或者Class，根據(jù)自己的業(yè)務(wù)需要實現(xiàn)生命周期函數(shù)。

2、 實例的：組件注冊到播放器，在播放創(chuàng)建的過程中也創(chuàng)建組件實例，組件是可以保存狀態(tài)的，因此一個組件定義，可以注冊多個到播放器，通過傳遞不通的參數(shù)，構(gòu)建不同的組件，具有不同的行為。

3、 開源的：每個開源組件都包含了通用的基本功能，用戶可以在開源的基礎(chǔ)上實現(xiàn)自己的個性化需求，給用戶更大的自主權(quán)。

組件提供了兩種方式讓用戶去開發(fā)自己的播放器組件：

a. ES6的class類型定義一個組件

當您的項目是使用ES6的語法，通過webpack或者babel構(gòu)建時，建議使用這種方式。

b. 使用Aliplayer提供的Component方法

2. 如何啟用組件

播放器提供了components屬性，通過給components賦值，讓播放器使用組件，此屬性的類型為Array，如果組件創(chuàng)建是構(gòu)造函數(shù)沒有初始參數(shù)，直接把組件類型作為值，比如：components :[staticADComponent]，否則通過對象字面量的形式指定類型和參數(shù)，參數(shù)也是一個數(shù)組，比如： components :[{type:staticADComponent,args:[1,2]}]，如果需要獲取實例的組件，需要設(shè)置name屬性。

啟用組件

3. 如何獲取組件

有的場景下，需要獲取組件做一下事情，比如調(diào)用組件里的方法，這時可以通過播放器的getComponent方法獲取，參數(shù)為組件的名字。

目前，Aliplayer已經(jīng)實現(xiàn)了8個常用的組件，并且開源于github，用戶可以獲取實現(xiàn)的代碼，并且也可以貢獻自己的代碼和建議。

? 記憶播放

? 開始廣告

? 暫停廣告

? 播放下一個

? 播放列表

? 旋轉(zhuǎn)和鏡像

? 視頻廣告

? 彈幕

? 試看

如果用戶實現(xiàn)了Aliplayer的組件，并且想貢獻出來，可以聯(lián)系我們，我們會在github首頁添加導(dǎo)航，鏈接到您的github項目上。

Aliplayer體驗館：

https://player.alicdn.com/ali...

Aliplayer Github：

https://github.com/aliyunvide...

本文作者：樰籬

閱讀原文

本文為云棲社區(qū)原創(chuàng)內(nèi)容，未經(jīng)允許不得轉(zhuǎn)載。