简介
bc-video-player
是一个基于 Brightcove 的 Video Cloud 的 HTML5 播放器。它可以用于在网站上播放音频和视频。这个教程将会教你如何使用 bc-video-player
来在你的网站上播放视频。
安装
使用 npm 包管理器安装 bc-video-player
:
npm install bc-video-player --save
导入
使用类似下面这样的语句导入 bc-video-player
:
import BCVideoPlayer from 'bc-video-player';
HTML
添加一个用于放置播放器的 div
元素到你的 HTML 页面:
<div id="video-container"></div>
配置
配置播放器,并传入视频 ID 和其他参数:
const player = new BCVideoPlayer({ containerId: 'video-container', accountId: '{YOUR_ACCOUNT_ID}', videoId: '{YOUR_VIDEO_ID}', playerId: '{YOUR_PLAYER_ID}', embedId: '{YOUR_EMBED_ID}', playerKey: '{YOUR_PLAYER_KEY}' });
参数说明:
containerId
: 用于放置播放器的div
元素的 ID。accountId
: Video Cloud 账户 ID。videoId
: 要播放的视频 ID。playerId
: 播放器 ID。embedId
: 嵌入 ID。playerKey
: 播放器密钥。
操作
播放视频:
player.play();
暂停视频:
player.pause();
跳转到指定时间:
player.seek(30);
显示/隐藏控制器:
player.toggleController();
获取当前时间:
const currentTime = player.getCurrentTime(); console.log(currentTime);
结论
bc-video-player
是一个非常容易使用的 HTML5 播放器,它可以很容易地集成到任何网站中。通过这个教程,你已经学会了如何使用这个播放器来播放视频,并且学习了一些最基本的操作方法。希望这个教程能够对你带来帮助。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005604981e8991b448de750