相关API

优质
小牛编辑
153浏览
2023-12-01

页面可以主动调用播放器api,用于获取播放器数据、设置播放器数据或改变播放器播放行为。播放器所有api如下:

1、window下的api:

api方法参数返回值说明示例支持版本
createCCH5Player(config){对数配置对象}播放器对象创建播放器var player = createCCH5Player({vid: '49978DE73FEBAC369C33DC5901307461', siteid:'407C0500BD0F12BC'})V2.1.0及以上

2、播放器对象下的api:

使用js播放代码时播放器对象是window.cc_js_Player,同一页面多个视频时会被覆盖,可通过 on_CCH5player_ready回调获取与视频相关的播放器对象。 使用window.createCCH5Player({...})方法主动创建播放器时此方法返回值即为播放器对象。

api方法参数返回值说明示例支持版本
play()让视频播放player.play()V2.1.0及以上
pause()让视频暂停player.pause()V2.1.0及以上
getDuration()视频时长(秒)获取视频时长,视频播放后才能获取player.getDuration()V2.1.0及以上
getPosition()当前视频播放时间(秒)获取视频播放了多少时间,单位秒,视频播放后才能获取player.getPosition()V2.1.0及以上
setVolume(volumn)volumn:音量设置音量,取值[0-1]的小数player.setVolume(0.5)V2.1.0及以上
setQuality(quality)quality:要切换的目标清晰度值切换成指定清晰度player.setQuality(20)V2.1.0及以上
jumpToTime(second)second:指定的播放时间点跳转到某个时间点播放,单位秒player.jumpToTime(30)V2.1.0及以上
normalScreen()退出全屏播放player.normalScreen()V2.1.0及以上
fast_forward_time(speed)speed:速度设置快进快退速度,参数 speed 取值[0-1]时为百分比跳转, 大于1时为值跳转player.fast_forward_time(10)V2.1.0及以上
destroy()第二个视频替换第一个视频播放时销毁第一个视频播放产生的资源,主要是定时器,销毁后不能再播放player.destroy()V2.1.0及以上
getQualities()当前视频可⽤清晰度列表Array
eg. [{value:"0",label:"普通"},{value:"1",label:"清晰"}]
player.getQualities()V2.1.0及以上
setQuality(quality)quality设置清晰度,参数 quality 为 getQualities 方法获取的 value 值player.setQuality(quality)V2.1.0及以上
fullScreen()进入全屏player.fullScreen()V2.4.0及以上
isFullScreen()true为全屏;false非全屏获取当前屏幕全屏状态player.isFullScreen()V2.4.0及以上
getCurrDf()当前清晰度获取当前清晰度player.getCurrDf()V2.4.0及以上
getCurrRate()当前倍速获取当前播放倍速player.getCurrRate()V2.4.0及以上
getVideoState()当时播放状态play or pause获取播放状态player.getVideoState()V2.4.1及以上
setQuestions(questions)questions必须为数组设置问答V2.4.6及以上
changeQuestionItem(data)data为问答数据对象修改某个时间点的问答V2.4.6及以上

1、 H5 video标签相关api二次封装后的回调

使用样例

注意:目前CC H5播放器有以下可选的回调函数,需要在CC H5播放器script加载之前向全局暴露这些函数


<script>
    function on_CCH5player_ready(obj) {
        console.log('CCH5player_ready', obj);
    }

    function on_CCH5player_play() {
        console.log('CCH5player_play');
    }

    function on_CCH5player_pause() {
        console.log('CCH5player_pause');
    }

    function on_CCH5player_ended() {
        console.log('CCH5player_ended');
    }
</script>

<script src="https://p.bokecc.com/player?vid=aaa&siteid=xxx&autoStart=false&width=600&height=490&playerid=bbb&playertype=1" type="text/javascript"></script>

2、播放器回调

播放器回调方法是window对象下的方法,所有回调方法如下:

回调方法参数返回值说明支持版本
on_CCH5player_ready(obj)obj: 包含videoElement、container、vid三个属性,分别指当前视频对象,当前播放器容器,当前视频id播放器初始化完成即将播放时回调V2.1.0及以上
on_CCH5player_adEnd(adId, vid)adId: 广告id, vid: 视频id广告播放结束时回调V2.1.0及以上
on_pause_showAd(vid)vid: 视频id暂停广告显示时回调V2.1.0及以上
on_CCH5player_play(video, vid)video: 视频节点对象, vid: 视频id播放时回调V2.1.0及以上
on_CCH5player_pause(video, vid)video: 视频节点对象, vid: 视频id暂停播放时回调V2.1.0及以上
on_CCH5player_ended(video, vid)video: 视频节点对象, vid: 视频id播放结束时回调V2.1.0及以上
is_skip_ad(vid)vid: 视频id返回true或false,为true时表示跳过广告播放器初始化完成时回调V2.1.0及以上
get_cc_verification_code(vid)vid: 视频id返回授权验证码播放器开始加载数据时回调V2.1.0及以上
get_custom_id(vid)vid: 视频id返回自定义统计参数播放器开始加载数据时回调V2.1.0及以上
on_player_fullscreen(mode, vid)mode: 0为退出全屏,1为变成全屏,vid:视频id播放器退出全屏或变全屏时回调V2.1.0及以上
on_switch_quality(vid, newQuality)vid: 视频id, newQuality: 切换后的清晰度值切换清晰度时回调V2.1.0及以上
on_player_volumechange(volumn, vid)volumn: 音量改变后值, vid: 视频id改变音量时回调V2.1.0及以上
on_player_seek(prevTime, currentTime)prevTime: 进度变化前时间, currentTime: 视频进度变化后时间拖动或点击进度条改变播放进度时回调V2.1.0及以上
on_switch_rate (vid, newRate)vid: 视频id, newRate: 切换后的倍速值切换倍速时回调V2.1.0及以上
on_h5player_error(errInfo)errInfo包含errCode,errMsg,siteId,vid错误码回调,错误码列表见本页面底部V2.3.6及以上
on_player_start_drag(currentTime, vid)currentTime: 视频当前进度开始拖动进度条时回调V2.4.0及以上
on_player_buffering(obj)obj包含vid,flag ;flag: 1缓冲中,0缓冲结束缓冲中或者缓冲结束回调V2.4.0及以上
on_player_qa_show(obj, vid)obj包含自定义问答功能该问答信息问答显示的回调V2.4.6及以上
on_player_qa_skip(obj, vid)obj包含自定义问答功能该问答信息跳过问答的回调V2.4.6及以上
on_player_qa_result(obj, vid)obj包含自定义问答功能question(问答信息),isRight(1为答对;0为答错),answersId(已选id)问答结果回调V2.4.6及以上
on_player_qa_review(obj, isRight, vid)obj该问答相关信息,isRight(1为答对;0为答错),vid(视频id)问答回看回调V2.4.11及以上

3、播放器js加载完成回调

回调方法参数返回值说明支持版本
onCCH5PlayerLoaded()播放器js文件加载完成时回调V2.1.0及以上

4、错误码

错误码说明显示内容支持版本
1000参数不合理No video url, please check the parametersV2.3.6及以上
1001vid或siteId 不存在The vid or siteId does not existV2.3.6及以上
1002vid和siteId不匹配The vid does not match the siteIdV2.3.6及以上
1003vid或siteId格式不正确The format of vid or siteId is incorrectV2.3.6及以上
2001开始下载元数据错误The video file loaded failedV2.3.6及以上
2002播放时错误Error occured while playingV2.3.6及以上
3000网络不可用The network is unreachable, please click RefreshV2.3.6及以上
3001加载超时A network request timed outV2.3.6及以上
3002服务端请求错误Error occurred while requesting serverV2.3.6及以上

5、api示例

5.1自定义问答使用示例

var player = createCCH5Player({
    vid:'A4F81E6E8DD693A59C33DC5901307461',
    siteid: '2661F9756E5C832E',
    width: '600',
    height: '400',
    autoStart: 'true',
    //播放器容器,可以是选择器如#id或.class等,也可以是节点对象
    parentNode: '#playerContainer'
});
function on_CCH5player_ready() {
    var questions=[{
        "answers":[
          {"right":true,"id":1,"content":"A、选项一"},
          {"right":false,"id":2,"content":"B、选项二"},
          {"right":false,"id":3,"content":"C、选项三"},
          {"right":false,"id":4,"content":"D、选项四"}
        ],
        "showTime":5,
        "explainInfo":"",
        "explainWrongAns": "",
        "jump":true,
        "backSecond":-1,
        "keepPlay":true,
        "id":10,
        "content":"问答题目1"
    }]
      player.setQuestions(questions) // 设置问答

    var data = {
        "answers": [
            {"right": true, "id": 1, "content": "A、选项一"},
            {"right": false, "id": 2, "content": "B、选项二"},
            {"right": false, "id": 3, "content": "C、选项三"},
            {"right": false, "id": 4, "content": "D、选项四"}
        ],
        "showTime": 5,
        "explainInfo": "",
        "jump": true,
        "backSecond": -1,
        "keepPlay": true,
        "id": 12,
        "content": "问答题目12"
    }
    player.changeQuestionItem(data)  // 修改某个时间点的问答
}