整合百度智能云播放器 cyberplayer,支持m3u8格式(hls)的直播流和点播、支持flv的直播流和点播、支持rtmp直播、支持Mp4播放、更多的功能可以看看下面的文档配置:
支持Flash与HTML5两种模式:
- 可根据浏览器特性及视频格式,在Flash与HTML5两种模式间自动切换。
注意:因为现在很多浏览器都不在兼容或不支持Flash,rtmp必须Flash形式,所以感觉它快被时代给淘汰了,HTML5已成为主流。
使用cyberplayer播放器的优点:
1.兼容性好,像阿里的Aliplayer播放器,ckplayer X2播放器,虽然不错,但是直播和点播需要单独写“live”属性,而cyberplayer播放器则可自动识别。
2.像西瓜视频的SDK,引用js时还要区分,感觉是最差劲的,上述几个播放器则不需要
3.自定义功能相对比较强大,可简单配置一些参数就可以使用了。
使用方法:
1.新建php文件,如“index.php”,代码如下
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>深度直播</title>
<script type="text/javascript" src="https://bce.bdstatic.com/jwplayer/3.5.2/cyberplayer.js"></script>
<style type="text/css">
html, body {width:100%;height:100%;margin:auto;overflow: hidden;}
</style>
</head>
<body>
<div id="playercontainer"></div>
<script type="text/javascript">
var player = cyberplayer("playercontainer").setup({
width: "100%", // 宽度,也可以支持百分比(不过父元素宽度要有)
height: "100%", // 高度,也可以支持百分比
title: "百度点播/直播",
file: "<?php echo $_GET['url'];?>", //
image: "https://bj.bcebos.com/im-cs/930fc4ca81c47210347d43324a66e7c7.jpg", // 视频截图
autostart: true,// 是否自动播放
stretching: "uniform",// 拉伸设置
repeat: true,// 是否重复播放
volume: 98,//默认音量
controls: true, // controlbar是否显示
starttime: 0,
logo: { // logo设置
linktarget: "_blank",
margin: 8,
hide: false,
position: "top-right", // 位置
file: "https://bj.bcebos.com/im-cs/acc8d3b78c3f094e170a9a2597e1aefa.png" // 图片地址
},
rightclick: [ // 右键配置
{
title: "Version:v1.18.2",
link: "https://www.360mb.net"
},
{
title: "360模板吧提供服务", // 标题1
link: "https://www.360mb.net/121.html" // 跳转链接
}
],
controlbar: {
barLogo: true, // 进度条上的logo显示与否,默认true
barLogoUrl: "https://www.jxvip.top/", // 进度条上的logo的跳转地址可配置
canDrag: true, // 进度条是否允许拖动,默认true
},
skin: {
name: "roundster", // 默认皮肤-bce,其他可选项有beelden, bekle, five, glow, roundster, seven, six, stormtrooper, vapor
background: "#22232885", // 背景色设置
inactive: "#fff", // 未激活时的颜色
active: "#ff142b", // 悬浮或激活的严责
},
ak: "41707430fa52422f83b8efdc797f90c1"// 公有云平台注册即可获得accessKey
});
</script>
</body>
</html>
2.将index.php文件上传服务器,就可以调用了
3.调用地址参考如下
http://你的网址//index.php?url=http://cyberplayer.bcelive.com/videoworks/mda-kbuhu4wqdi08dwix/cyberplayer/mp4/cyberplayer-demo.mp4
注:js调用的百度cyberplayer官方的,也可以自己去下载下来使用,下载链接:cyberplayer播放器-Web-SDK
cyberplayer文件结构:
Baidu-T5Player-SDK-Web-v<version>
├── player
│ ├── videojs
│ │ ├── video.js
│ │ ├── video.min.js
│ │ ├── videojs-contrib-hls.js
│ │ └── videojs-contrib-hls.min.js
│ ├── flv.js
│ ├── cyberplayer.js
│ ├── cyberplayer.flash.swf
└── README
更多使用方法请参照百度cyberplayer播放器-Web-SDK说明,360模板吧感谢大家的支持!
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END