想在自己的網站上發布影片,例如 Chrome 線上應用程式商店新推出的 60minute 或 RedBull.tv 應用程式,想用既有趣又美觀的方式發布影片嗎?很高興在此宣布,我們推出了影片播放器範例網頁應用程式!「影片播放器範例」是開放原始碼的影片播放器網頁應用程式,採用與 60 Minutes 和 RedBull.tv 應用程式相同的架構建構而成。並能自訂、擴充或直接使用,並填入你自己的內容。
![全螢幕影片播放器範例](https://developer.chrome.google.cn/static/blog/introducing-video-player-sample/image/video-player-example-full-2812628a435e9.png?hl=zh-tw)
![影片播放器範例](https://developer.chrome.google.cn/static/blog/introducing-video-player-sample/image/video-player-example-4d6684277e104.png?hl=zh-tw)
運作方式
使用者開啟「影片播放器範例」後,可以選擇觀看單一影片,或從使用者已上傳並填入應用程式的清單,建立影片/劇集播放清單。「影片播放器範例」已設定完成,影片相關資訊則分別儲存在 JSON 檔案 (config.json 和 data.json) 中,兩者皆位於資料目錄中。
主要功能與特色
- 支援全螢幕觀賞體驗
- 訂閱節目、觀看劇集及建立播放清單
- 支援多種影片格式,視使用者瀏覽器支援的功能而定 (包括 WebM、Ogg、MP4 甚至 Flash 備用廣告)
- 「類別」頁面會概略說明應用程式中提供的不同節目/類別
- 新集數通知 (已透過 Chrome 線上應用程式商店安裝應用程式時)
- 提供分享到 Google+、Twitter 和 Facebook 的支援功能
- 為了確保可輕鬆自訂,所有來源檔案 (包括 Photoshop PSD) 都包含在內
建構方式
下方是針對採用 HTML 和 JavaScript 的開放網路平台所編寫的影片播放器範例,範圍大致遵循「模型檢視控制器」的模式和結構。
- 是使用開放原始碼的 Google Closure JavaScript 程式庫建構
- 與 Closure Compiler
- 透過 Chrome 線上應用程式商店發布,以便使用通知功能
瀏覽器支援
「影片播放器範例」不僅可透過 Chrome 線上應用程式商店安裝,而且已測試過,可在所有新型瀏覽器中正常運作。
立即體驗
你可以在示範應用程式中查看影片播放器的實際運作示範。如要進一步瞭解應用程式的運作方式,請參閱說明文件。
您可以從 Google 程式碼取得程式碼。
歡迎繼續觀看影片!