关于前端直播（videoJS与百度云web播放器：Cyberplayer3.0试用）

文章目录

videoJS
- 打开方式
- 记录
- - 初始化
  - 居中播放按钮
百度视频播放器demo
- 打开方式
- 修改

videoJS

videoJs 文档 https://docs.videojs.com/docs/

实现PC/移动端适应直播，暂停播放出现广告（哎，万恶的广告）

打开方式

下载此demo，浏览器打开 index.html

记录

初始化

直接在标签里面加上 class="video-js" 和 data-setup='{}' 属性。

通过JS初始化

// 初始化播放器
var myPlayer = videojs(document.querySelector(".video-js"), {controls: true,autoplay: false,preload: "auto"
});
myPlayer.src([{ type: "", src: "" }]); // 播放资源
myPlayer.poster(”“); // 预览图
myPlayer.ready(function() {// 开始播放this.on("play", function() {// ...});// 暂停this.on("pause", function() {// ...});
});

居中播放按钮

在 video 标签中添加 class vjs-big-play-centered

<video class="video-js vjs-big-play-centered" ></video>

在暂停的时候出现播放按钮，可通过添加样式

.vjs-paused .vjs-big-play-button {display: block;
}

百度视频播放器demo

官网demo地址: http://cyberplayer.bcelive.com/demo/new/index.html
用户手册：https://cloud.baidu.com/doc/MCT/Web-SDK.html#.E4.BC.98.E5.8A.BF

实现PC/移动端适应直播，暂停播放出现广告（咦，同上demo）

打开方式

下载此 demo
登陆百度云管理中心，获取 Access Key （免费的），登陆地址:https://cloud.baidu.com/?from=console
在此文件夹的 index.html 中填写你的 Access Key，浏览器打开即可

修改

视频播放器的图片广告宽高为固定的 400 * 300，可能与实际使用不符。此文件夹中的 cyberplayer.js 文件，相关地方已经被我统一改为变量：

window.ADWIDTH = 400; // 广告宽度
window.ADHEIGHT = 300; // 广告高度

可通过修改 window.ADWIDTH 和 window.ADHEIGHT 自定义

原文件位于 baidu 文件夹中

关于前端直播（videoJS与百度云web播放器：Cyberplayer3.0试用）相关推荐

html 百度云视频无法播放器,关于前端直播（videoJS与百度云web播放器：Cyberplayer3.0试用）...
videoJS 实现PC/移动端适应直播,暂停播放出现广告(哎,万恶的广告)git 打开方式下载此demo,浏览器打开 index.htmlgithub 记录初始化直接在标签里面加上 class ...
html影音播放器百度云,关于前端直播（videoJS与百度云web播放器：Cyberplayer3.0试用）...
文章目录 videoJS 打开方式记录初始化居中播放按钮百度视频播放器demo 打开方式修改 videoJS videoJs 文档 https://docs.videojs.com/docs ...
百度网盘播放地址html,百度云web播放器cyberplayer的flv播放地址一定要支持跨域访问如何设置...
cyberplayer, 官方demo 百度云web播放器: Cyberplayer3.0 Demo http://cyberplayer.bcelive.com/demo/new/index.htm ...
融云 CDN 播放器 2.0 版本正式上线
近期,融云自研 CDN 播放插件 2.0 版本正式上线.在原有版本支持融云内置 CDN 直播流播放的基础上,开放了相关 API,满足开发者的多种业务需求.关注[融云全球互联网通信云]了解更多融云 C ...
007-安装百度云,搜狗输入法,播放器
一.安装百度云bypy客户端 1.安装pip yum install python-pip 没有python-pip包就执行命令 yum -y install epel-release 对安装好的pi ...
【无标题】阿里云web播放器 ios报4301错误
在使用阿里云播放器播放阿里云加密视频时候苹果的手机和电脑都会报错4013错误,我们的原因是后台的debug没有关闭,下次遇到可作为造成原因之一查看
阿里视频云web播放器常见问题汇总
1. 如何正确选择播放器 Aliplayer播放器包含H5.Flash.自适应播放器,建议用户选择自适应播放器,可以根据终端类型.浏览器类型和地址协议选择最合适的播放器. 如果是加密播放只能选择Fla ...
快速使用百度云BDCloudVideoView播放器
1.去下载SDK https://cloud.baidu.com/doc/Downloadcenter/player.html#SDK.E4.B8.8B.E8.BD.BD 2.解压我们这篇博客只需要 ...
阿里云Aliplayer视频播放（web播放器）
1.官方文档https://help.aliyun.com/document_detail/125548.html?spm=a2c4g.11186623.6.1089.3f4b317c0dCNvV 2 ...
Web播放器 TcPlayer——腾讯直播sdk的网页播放器
https://www.qcloud.com/document/product/267/7479 功能介绍腾讯云Web播放器主要解决在手机浏览器和PC浏览器上播放音视频流的问题,使您的视频内容可以不 ...

关于前端直播（videoJS与百度云web播放器：Cyberplayer3.0试用）

文章目录

videoJS

打开方式

记录

初始化

居中播放按钮

百度视频播放器demo

打开方式

修改

关于前端直播（videoJS与百度云web播放器：Cyberplayer3.0试用）相关推荐

最新文章

热门文章