1. 视频播放器组件API文档

1.1. sdk使用

1.1.1. PC web端播放

（1）页面引入以下sdk文件：

<script src="https://edu-cms.nosdn.127.net/topics/js/eduPlayer-2024-05-24.all.min_57f5a6f3bfcc8dd234ed568427301696.js"></script>

（2）使用create方法创建播放器实例：

const playerIns = window.EduPlayer.create({
    parent: document.body // 播放器参数
    appId:xxx, //产品appId，详见参数说明
    nonce: xxx, //随机数，详见参数说明
    signature: xxx, //签名，将(appSecret+nonce+timestamp)三个参数拼接的字符串，进行SHA1哈希计算
    timestamp: xxx, //时间戳随机数，
    uid:xxx, // 第三方用户id，详见参数说明
    videoData:{   
        videoId: xxx, // 从后端获取，详见参数说明
        signature: xxx // 从后端获取，视频播放凭证，详见参数说明
    }
});

在线演示demo：

web版本 https://www.icourse163.org/topics/sdk-video-test-web/

1.1.2. mobile web端播放

（1）页面引入一下sdk文件：

<script src="https://edu-cms.nosdn.127.net/topics/js/eduPlayer-2024-05-24.all.min_57f5a6f3bfcc8dd234ed568427301696.js"></script>
<link href="https://edu-cms.nosdn.127.net/topics/css/res_base_wap_bf7fa73141ee9a696b08098cbe903925.css" rel="stylesheet" />
<script src="https://edu-cms.nosdn.127.net/topics/js/wap_flexible_8254ebe28c3ef10de10b5befac286b8c.js"></script>
<script src="https://edu-cms.nosdn.127.net/topics/js/hammer.2.0.7.min_084aa824c6e6f64cf28551d070abe00c.js"></script>

（2）使用create方法创建播放器实例：

const playerIns = window.EduPlayer.create({
    parent: document.body // 播放器参数
    appId:xxx, //产品appId，详见参数说明
    nonce: xxx, //随机数，详见参数说明
    signature: xxx, //签名，将(appSecret+nonce+timestamp)三个参数拼接的字符串，进行SHA1哈希计算
    timestamp: xxx, //时间戳随机数，详见参数说明
    uid:xxx, // 第三方用户id，详见参数说明
    videoData:{
        videoId: xxx, // 从后端获取，详见参数说明
        signature: xxx // 从后端获取，视频播放凭证，详见参数说明
    }
});

在线演示demo：

web版本 https://www.icourse163.org/topics/sdk-video-test-web/

播放器参数列表

使用create方法创建播放器实例：

const playerIns = window.EduPlayer.create({
    parent: document.body // 播放器参数
    appId:xxx, //产品appId，详见参数说明
    nonce: xxx, //随机数，详见参数说明
    signature: xxx, //签名，将(appSecret+nonce+timestamp)三个参数拼接的字符串，进行SHA1哈希计算
    timestamp: xxx, //时间戳随机数，详见参数说明
    uid:xxx, // 第三方用户id，详见参数说明
    videoData:{
        videoId: xxx, // 从后端获取，详见参数说明
        signature: xxx // 从后端获取，视频播放凭证，详见参数说明
    }
});

全部参数：

1.2. 播放器实例方法

1.2.1. 方法列表

1.2.2. stop

停止播放，停止加载视频

参数：无

返回值：void

代码示例：

playerIns.stop();

1.2.3. pause

暂停视频播放

参数：无

返回值：void

代码示例：

playerIns.pause();

1.2.4. resume

恢复，播放视频

参数：无

返回值：void

代码示例：

playerIns.pause();

1.2.5. seek

跳转到指定位置开始播放

参数：

返回值：void

代码示例：

playerIns.seek(seekSecs);

1.2.6. getPosition

获取当前播放的时间点，时间单位是秒

参数：

返回值：void

代码示例：

playerIns.getPosition(function(pos){
    alert(pos); // pos是一个数字，单位是秒
}));

1.2.7. getState

获取视频状态

参数：

返回值：void

代码示例：

playerIns.getState(function(state){
    alert(state);
}));

状态常量说明

1.2.8. getStateInfo

获取播放器的状态详细信息

参数：

返回值：void

代码示例：

playerIns.getStateInfo(function(state){
    alert(stateInfo);
}));

stateInfo详细字段

1.2.9. getLog

获取当前播放器全部日志

参数：无

返回值：void

代码示例：

playerIns.getLog();

1.2.10. getVideoNode

获取播放器原生video标签

参数：无

返回值：void

代码示例：

playerIns.getVideoNode();

1.2.11. exitFullScreen

退出全屏

参数：无

返回值：void

代码示例：

playerIns.exitFullScreen();

1.2.12. destroy

销毁播放器实例，删除相关dom节点

参数：无

返回值：void

代码示例：

playerIns.destroy();

1.3. 播放器实例事件

1.3.1. 使用

使用$on方法绑定播放器实例的事件处理方法，使用方法如下：

playerIns.$on('onPlay', function(){
    alert('playing');
});

如果只运行一次事件处理方法使用$once，使用方法如下：

playerIns.$once('onPlay', function(){
    alert('playing');
});

使用$off移除事件处理方法，使用方法如下：

playerIns.$off('onPlay');

1.3.2. 事件列表

1.3.3. onStartLoad

视频开始加载

参数：

1.3.4. onPlayEnd

视频播放完毕事件

参数：无

1.3.5. onChangeVolume

音量改变事件

参数：

1.3.6. onMute

静音事件

参数：

1.3.7. onPlay

播放事件，在每次开始播放时候触发

参数：无

1.3.8. onTimeupdate

视频播放时间更新事件

参数：

1.3.9. onBuffering

缓冲事件

参数：无

1.3.10. onPause

暂停事件

参数：无

1.3.11. onSeek

拖动事件

参数：

1.3.12. onFullscreenChange

全屏事件

参数： |名称|类型|描述| | :-- | :-- | :-- | |data|Boolean| true全屏，false非全屏 |

1.3.13. onError

播放器出错事件

参数： |名称|类型|描述| | :-- | :-- | :-- | |data|String| 错误信息

1.4. 常见错误提示

1. 页面已过期，请刷新页面[code:-1]

说明：获取视频数据的接口返回异常，可能原因是signature过期

1. 视频获取失败[code:-2]
2. 视频获取失败[code:-4]
3. 视频获取失败[code:-5]
4. 视频获取失败[code:-6]

说明：2～5都是获取视频接口返回的数据不存在或者不正确，可能原因是videoId不存在或不正确，signature过期或不正确

接口返回的数据应该符合一下结构：

{
    code:0,
    message:"ok",
    result:{
        videos:[{
            videoUrl: xxx
        }]}
}

1. 不支持该视频播放[6]

说明：视频的格式不支持播放

1. 抱歉视频无法播放[7]

说明：可能是网络或者视频地址不存在

1. 抱歉视频无法播放[8]

说明：可能是网络问题

9.不支持该视频播放[9]

说明：m3u8解密出错

1. 抱歉视频无法播放[10]

说明：hlsjs报错，较少出现

1. 抱歉视频无法播放[11]

说明：flvjs报错，较少出现