<div id="video"></div>
<script src="//player.polyv.net/script/player.js"></script>
<script>
var player = polyvPlayer({
wrap: '#video',
width: 800,
height: 533,
vid: 'e8888b74d1229efec6b4712e17cb6b7a_e',
});
</script>
width{'100%'}、height{'auto'}falsefalsetrue,则播放器将打开 flash 播放器
statistics: {
session_id: 'class_1', // 播放场次标识
param1: '1', //自定义参数,可设置4个
param2: '2',
param3: '3',
param4: '4',
}
play.HTML5.changeRepeat改变
adMatter: [
{
addrurl: 'http://www.polyv.net/', //广告跳转链接
adtype: 2, //广告资源类型: 1 图片广告 、2 视频广告、3 swf广告(flash播放器生效)
location: 1, //广告位置: 1 片头广告、2 暂停广告 、3 片尾广告
timesize: 10, //广告时长(单位:秒)
matterurl: 'test.mp4', //广告地址
cataid: 1 //分类ID(可选,默认为 1)
}
]
视频广告只支持MP4格式
truefalse
// php
function get_client_ip() {
if (!empty($_SERVER['HTTP_CLIENT_IP'])) {
$ipaddress = $_SERVER['HTTP_CLIENT_IP'];
} elseif (!empty($_SERVER['HTTP_X_FORWARDED_FOR'])) {
$ipaddress = $_SERVER['HTTP_X_FORWARDED_FOR'];
} else {
$ipaddress = $_SERVER['REMOTE_ADDR'];
}
return $ipaddress;
}
$userId = 'your userId'; // polyv 提供的服务器间的通讯验证
$secretkey = 'your secretkey'; // polyv 提供的接口调用签名访问的key
$videoId = '65956867df8c717eb79136e05394122c_6'; // 视频对应vid
$ts = time() * 1000; // 时间戳
$viewerIp = get_client_ip(); // 用户 ip
$viewerId = '12345'; // 自定义用户 id
$viewerName = 'testUser'; // 用户昵称
$extraParams = 'HTML5'; // 自定义参数
/* 将参数 $userId、$secretkey、$videoId、$ts、$viewerIp、$viewerIp、$viewerId、$viewerName、$extraParams
按照ASCKII升序 key + value + key + value ... +value 拼接
*/
$concated = 'extraParams'.$extraParams.'ts'.$ts.'userId'.$userId.'videoId'.$videoId.'viewerId'.$viewerId.'viewerIp'.$viewerIp.'viewerName'.$viewerName;
// 再首尾加上 secretkey
$plain = $secretkey.$concated.$secretkey;
// 取大写MD5
$sign = strtoupper(md5($plain));
// 然后将下列参数用post请求 https://hls.videocc.net/service/v1/token 获取 token
$url = 'https://hls.videocc.net/service/v1/token';
$data = array('userId' => $userId, 'videoId' => $videoId, 'ts' => $ts, 'viewerIp' => $viewerIp, 'viewerName' => $viewerName, 'extraParams' => $extraParams, 'viewerId' => $viewerId, 'sign' => $sign);
$options = array(
'http' => array(
'header' => "Content-type: application/x-www-form-urlencoded\r\n",
'method' => 'POST',
'content' => http_build_query($data)
)
);
$context = stream_context_create($options);
$result = file_get_contents($url, false, $context);
// 获取返回结果的 token, 再传入 playsafe 中播放加密视频
$token = json_decode($result)->data->token;
var player = polyvPlayer({
wrap: '#video',
width: 800,
height: 533,
vid: '02bfeb00e2ea42ec033fedfbd24c2879_0',
playsafe: '<?php echo $token ?>' //传入服务器生成token
});
true 则播放器默认打开 HTML5 播放器,否则将打开flash 播放器polyvPlayer.isSupportHTML5查询是否支持false,反之为HTML5播放器的实例,该实例之后会说明false,反之返回多终端代码初始化的实例,该实例之后会说明j2s_getCurrentTime 、 j2s_getDuration 、 j2s_pauseVideo 、 j2s_resumeVideo 、 j2s_stopVideo 、 changeVid 、 j2s_stayInVideoTime 、 j2s_realPlayVideoTime 、 j2s_seekVideo 、 j2s_setVolume 、 changeRepeat 、 toggleFullscreen
player.HTML5.changeVid(options) 参数通过参数对象传入
player.on('HTML5Load', function() {
console.log(typeof player.HTML5); // 'object';
console.log(player.flash); // false
});
player.HTML5属性为HTML5播放器实例对象,反之为false
player.HTML5.video.addEventListener('playing', function() {
console.log('playing');
})
player.HTML5.video 中可以通过绑定 fullscreen 与 exitFullscreen事件来监听全屏与退出全屏事件flash: true会自动打开flash播放器,比如IE10、IE9。flashLoad 事件监听flash播放器是否加载
player.on('flashLoad', function() {
console.log(typeof player.flash); // 'function';
console.log(player.HTML5); // false
});
目前HTML5播放器兼容了部分flash播放器事件,设置后在HTML5播放器中也会触发,事件如下
s2j_onVideoPlay、s2j_onVideoPause、s2j_onPlayerInitOver、s2j_onPlayOver、s2j_onPlayStart、s2j_onFullScreen、s2j_onNormalScreen、s2j_onVideoSeek、s2j_onReadyPlay、s2j_onPlayerError
function s2j_onVideoPlay(vid) {
console.log(vid);
};
详情参考:flash播放器事件
skin_type: 'skin_blue' ban_set_player: 'off'
var player = polyvObject('#video').videoPlayer({
width: 800,
vid: '02bfeb00e2ea42ec033fedfbd24c2879_0',
flashvars: {
skin_type: 'skin_blue',
ban_set_player: 'off'
}
});
player.on('changeH5Success', function(newPlayer) {
player = newPlayer; // newPlayer 是初始化 HTML5 播放器后返回对象
});
forceH5forceH5 参数为 true 后播放器将默认打开 HTML5 播放器(浏览器不兼容除外),若需要播放加密视频需传入 playsafe 参数
// 返回 HTML5 播放器对象
var player = polyvObject('#video').videoPlayer({
width: 800,
vid: '65956867dfc7794f00b20912e5ea5ecc_6',
forceH5: true,
// playsafe: 'token' 加密视频需传入
});