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

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

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

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

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

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

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

組件系統特點：

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

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

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

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

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

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

b. 使用Aliplayer提供的Component方法

2. 如何啟用組件

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

啟用組件

3. 如何獲取組件

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

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

? 記憶播放

? 開始廣告

? 暫停廣告

? 播放下一個

? 播放列表

? 旋轉和鏡像

? 視頻廣告

? 彈幕

? 試看

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

Aliplayer體驗館：

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

Aliplayer Github：

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

本文作者：樰籬

閱讀原文

本文為云棲社區原創內容，未經允許不得轉載。