本文针对音视频平台常见的长视频播放场景,推出播放器播放长视频教程。用户将掌握如何在 Web 端、iOS 端、Android 端播放器上播放视频,同时自动切换自适应码流、预览视频缩略图、添加视频打点信息。
学习本阶段教程,您将掌握:
阅读之前,请先确保已经学习播放器指引的 阶段1:用播放器播放视频 篇部分,了解云点播 fileid 的概念。
本步骤,我们将指导您如何对视频转出自适应码流与雪碧图。
本步骤,我们将指导您新增的一组视频打点信息。
本步骤,我们将指导您在 Web 端、iOS 端、Android 端播放器播放自适应码流、添加缩略图与打点信息。
用户需要集成视立方播放器请参见 集成指引,引入播放器 SDK 文件之后,可以媒资管理提取上传媒资的 appId 和 fileId 进行播放。
播放器的构建方法为TCPlayer
, 通过其创建播放器实例即可播放。
在需要展示播放器的页面位置加入播放器容器。例如,在 index.html 中加入如下代码(容器 ID 以及宽高都可以自定义)。
<video id="player-container-id" width="414" height="270" preload="auto" playsinline webkit-playsinline>
</video>
在 index.html 页面初始化的代码中加入以下初始化脚本,传入获取到的 fileID 与 appID 即可播放。
var player = TCPlayer('player-container-id', { // player-container-id 为播放器容器 ID,必须与 html 中一致
fileID: '5285890799710670616', // 请传入需要播放的视频 fileID(必须)
appID: '1400329073' // 请传入点播账号的 appID(必须)
});
至此,您就可以在播放器查看雪碧图预览、视频打点信息和自动切换动态自适应码流。更多功能请参见 功能说明。
本页内容是否解决了您的问题?