PlayerAPI_v1.0.6副本

Size: px

Start display at page:

Download "PlayerAPI_v1.0.6副本"

琶翁
5 years ago
Views:

1 版本 : 日期 : 创盛视联数码科技 ( 北北京 ) 有限公司 (CC 视频 )

2 目录 1. 概述接口配置插件介绍字幕插件弹幕插件跑马灯插件问答功能插件附录 1. Flash 和 Javascript 交互附录 2. 播放器器错误码... 13

3 1. 概述利利用 Player API 与 CC 视频播放器器进行行交互, 可以改变播放器器界面实现一些增值功能目前仅限于 Flash 播放器器,FlashPlayer 插件版本要求为 10.1 及以上, 播放器器页面代码中必须允许播放器器与页面脚本通信 2. 接口接口分为两种类型 : 方法回调 ; 方法 : 播放器器开放的 JavaScript 函数, 播放器器的句句柄需要用Object 标签的 id 属性或 embed 的 name 属性来获取 ; 回调 : 播放器器运行行过程中尝试调用页面JS 函数, 可理理解为事件使用方法可参考附录 1. Flash 与 JavaScript 交互 ; 接口类型 start() 方法开始播放 pause() 方法暂停播放 resume() 方法恢复播放 seek(time) 方法定位至指定时间参数 time 单位秒 getduration() 方法获取视频片长, 返回值单位秒 getposition() 方法获取当前播放时间, 返回值单位秒 getqualities() 方法获取当前视频可用清晰度列列表, 返回类型 Array, 格式如下 : [ { value:"0", label:" 普通 ", { value:"1", label:" 清晰 " ] setquality(quality) 方法设置清晰度参数 quality 为 getqualities 方法获取的 value 值 setvolume(volume) 方法设置音量量参数 volume 取值范围 0-1 normalscreen() 方法退出全屏 setconfig(config) 方法配置播放器器参数 config 为配置对象, 详见3. 配置 on_cc_player_init(vid,swfid) 回调播放器器界面元素初始化时 vid : 视频唯一标识 swfid : 页面中播放器器的 id 第 1 页共 14 页

4 接口类型 on_cc_player_pluginready(name) 回调插件准备就绪, 意味着该插件相关接口可用 name : 插件名称 fast_forward_time(time) 方法设置快进快退速率参数 :time>1 则以 time 值为准, 0<time<1 则以总时长的百分比为准 ; gettitle() 方法获取标题返回类型 : 字符串串 getvalidquality() 方法获取当前播放视频的清晰度列列表返回值 :Array(); getzscale() 方法获取当前视频窗口的缩放值返回值 :Number; setzscale(value) 方法设置当前视频窗口的缩放参数 :value:number; 最大值时 1, 最小值是 0; setscale(value) 方法设置当前视频画面的比例例参数 :value:string full = 全屏 scale43 = 画面4 比3 scale169 = 画面16 比9 original = 原始比例例 getscale() 方法获取当前视频画面的比例例返回值类型 :String; clipvideoimage() 方法给视频截图并且保存到本地 3. 配置播放器器配置可以改变播放器器的界面, 开启更更多的回调接口, 还可以使用一些特殊的功能, 如自定义全屏字幕功能配置的方法是在回调接口 on_cc_player_init 触发时, 调用 setconfig 方法传递一个 Object 对象, 此对象每个 key 都是一个配置项, 对应的 value 就是所配置的值播放器器所支持的配置项如下 : 配置项 control_enable 是否显示控制条默认 1, 设置为 0 则不不显示控制条第 2 页共 14 页

5 配置项 progressbar_enable loadingpic_enable loading_enable bigbutton_enable startbutton_enable resumebutton_enable tip_enable alert_enable recommend_enable keyboard_enable rightmenu_enable fullscreen_enable 是否可操作进度条默认 1, 设置为 0 则进度条不不可操作是否启用缓冲片头默认 1, 设置为 0 则不不会出现缓冲片头是否显示 loading 图标默认 1, 设置为 0 则不不显示 loading 图标是否显示非自动播放时出现的开始按钮和暂停时的大播放按钮默认 1, 设置为 0 则不不显示如需要单独控制请使用 startbutton_enable,resumebutton_enable 是否显示非自动播放时出现的开始按钮默认 1, 设置为 0 则不不显示是否显示暂停时的大播放按钮默认 1, 设置为 0 则不不显示是否可显示播放器器顶部的提示条默认 1, 设置为 0 则不不再出现提示条是否可显示播放器器中间的提示面板默认 1, 设置为 0 则不不再出现提示面板是否启用播放结束后的推荐界面默认 1, 设置为 0 则播放结束后不不显示推荐界面是否启用按键操作默认 1, 设置为 0 则按键操作不不可用是否启用右侧菜单默认 1, 设置为 0 则不不显示右侧菜单是否使用自定义全屏操作默认 0, 设置为 1 可以替代 Flash 全屏 play_start_time 设置开播的时间点, 单位秒, 如果超出视频时长会按 0 处理理, 此配置项能够使接着上次观看功能失效 fullscreen_function 替代 Flash 全屏的 JS 函数的名称, 需 fullscreen_enable 设置为 1, 这个函数需要返回一个值以确定当前状态 (0: 正常,1: 全屏 ) video_marks 配置视频打点数据, 此配置项的值是一个数组, 格式如下 : [ { time : time, desc : desc ] time 为视频时间, 单位秒 ;desc 为对应时间的打点 video_marks_json_url player_plugins 配置视频打点数据接口地址, 优先级高于 video_marks, 接口必须返回 JSON 数据, 格式如下 : { value : [ { time : time, desc : desc ] 配置播放器器插件, 详见 4. 插件介绍第 3 页共 14 页

6 配置项 on_player_stop on_player_pause on_player_resume on_player_ready on_player_start on_player_seek on_player_buffering on_player_setquality on_player_volumechange on_player_playerror on_player_fullscreen 播放结束后回调 JS 函数的名称默认 on_spark_player_stop 暂停播放时回调 JS 函数的名称默认 on_spark_player_pause 暂停后继续播放时回调 JS 函数的名称默认 on_spark_player_resume 播放器器准备就绪回调 JS 函数的名称默认 on_spark_player_ready 开始播放时回调 JS 函数的名称默认 on_spark_player_start 指定时间定位时回调 JS 函数的名称回调时的参数 : from : 定位之前的时间点, 单位秒 to : 定位指定的时间点, 单位秒缓冲开始或结束时回调 JS 函数的名称回调时的参数 : flag : 是否缓冲中 (0: 否,1: 是 ) 清晰度改变时回调 JS 函数的名称回调时的参数 : quality : 当前清晰度音量量改变时回调 JS 函数的名称回调时的参数 : vol : 当前音量量 ( 范围 0-1) 当播放失败时回调 JS 函数的名称回调时的参数 : code : 错误码, 详见附录 2. 播放器器错误码全屏或退出全屏时回调 JS 函数的名称回调时的参数 : flag : 是否全屏 (0: 否,1: 是 ) 以下代码为配置示例例第 4 页共 14 页

7 <script type="text/javascript"> function customfullscreen(){ //TODO 自定义全屏 function onplaypaused(){ // 已暂停播放 function on_cc_player_init( vid, swfid ){ var config = {; config.fullscreen_enable = 1; config.fullscreen_function = "customfullscreen"; // 设置自定义全屏函数的名称 config.on_player_pause = "onplaypaused"; // 设置当暂停播放时的回调函数的名称 var player = getswf( swfid ); player.setconfig( config ); function getswf( swfid ) { if( window.document[ swfid ] ) { return window.document[ swfid ]; else if( navigator.appname.indexof( "Microsoft" ) == -1 ) { if( document.embeds && document.embeds[ swfid ] ) { return document.embeds[ swfid ]; else { return document.getelementbyid( swfid ); </script> 4. 插件介绍插件是指基于播放器器实现可插拔的独立功能块, 用户通过播放器器配置启用插件, 从而可以使用相应的功能要使用插件时, 在 player_plugins 配置项中添加插件的名称和参数 4.1 字幕插件字幕插件可使播放器器在播放视频的同时显示相关文字, 启用时在配置中添加插件名称 Subtitle, 参数如下 : 参数 url 字幕文件地址, 仅支持 srt 格式的字幕文件, 此参数为必需参数 size 字体大小, 默认 20 color surroundcolor font 字体颜色, 默认 0xFFFFFF 文字环绕颜色, 默认 0x 字体名称, 默认 Times New Roman 第 5 页共 14 页

8 参数 bottom 文本与播放区域底部的距离占播放区域高的百分比, 默认 0.15 code 字幕文件编码, 支持 utf-8 gbk, 默认 utf-8 注意事项 : 字幕文件所在的服务器器根目录需要部署一个安全策略略文件 ( crossdomin.xml ), 使播放器器能够跨域访问字幕文件了了解更更多关于安全策略略文件可访问 WS5b3ccc516d4fbf351e63e3d118a9b c85.html#WS5b3ccc516d4fbf351e63e3d118a9b e08 以下代码为字幕插件配置示例例 <script type="text/javascript"> function on_cc_player_init( vid, objectid ){ var config = {; config.player_plugins = { Subtitle : { url : " size : 20, color : 0xCCCCCC, surroundcolor : 0x0000FF, bottom : 0.15, font : " 微软雅黑 ", code : "gbk" ; var player = getswf( objectid ); player.setconfig( config ); </script> 4.2 弹幕插件启用时在配置中添加插件名称 BulletCurtain, 参数如下 : 参数 size 默认字体大小, 默认 30 color font 默认字体颜色, 默认 0xFFFFFF 默认字体名称, 默认 Times New Roman duration 所有弹幕在展示的时长, 单位秒, 默认 10 alpha 所有弹幕的不不透明度, 取值范围 0-1, 默认 1 visible 所有弹幕是否可见,1 为可见,0 不不可见, 默认 1 弹幕插件启用后还开放有如下接口 : 第 6 页共 14 页

9 接口 setbulletcurtainalpha(alpha) setbulletcurtainvisible(visible) addbullet(data, menu) 设置所有弹幕的不不透明度设置所有弹幕是否可见立刻显示一行行弹幕参数 data 是一个对象, 于此接口有意义的 key 如下 : id : 唯一标识符 text : 文字内容, 此为必要数据 type : 弹幕类型,0 为从右至左,1 为顶端, 2 为底端, 默认 0 size : 字体大小 color : 字体颜色 bordercolor : 边框颜色, 默认 -1 不不显示边框参数 menu 为一个数组, 用来构建弹幕的右键菜单, 默认为空数组元素需为一个对象 label : 菜单项显示的文字 callback : 菜单项点击后回调的 JS 函数名称, 回调时参数为 data removebullet(id) 移除一行行弹幕使用弹幕插件时, 需了了解此插件仅提供了了把文字渲染至视频画面上 ( 包括滚动和排列列 ) 的功能, 播放器器不不管理理各个弹幕与视频时间的对应关系, 调用 addbullet 时在当前时刻显示一个弹幕并在 duration 秒之后自动移除, 弹幕从画面中移除后 ( 设置 alpha 和 visible 不不会移除 ), 其相关数据都会丢弃, 所以 seek 到一个之前播放过的时间点, 需要重新调用 addbullet 以显示之前出现过的弹幕, 另外只有对于正显示着的弹幕调用 removebullet 才有意义 4.3 跑马灯插件启用时在配置中添加插件名称 Marquee, 参数如下 : 参数 data 数组类型, 可添加多个跑马灯值为 object 类型启用时各个 data 参数如下 : 参数 name looptime type text size 名称参数 :String 循环次数, 参数 :int -1 为无限循环大于 1 为循环次数跑马灯类型参数 :String text = 文本类型 image = 图片类型当类型为文本时字体样式设置才会生效同理理图片类型文本类型下文本内容类型 :String 文本类型下字体的大小类型 :uint 第 7 页共 14 页

10 参数 color url width height actions 文本类型下的字体颜色类型 :String 值为颜色值转换成字符串串图片类型下图像的 url 类型 :String 图片类型下图像的宽图片类型下图像的高运动动画类型数组, 参数如下示例例 :index: 运动顺序,duration: 运动时间 start 开始状态 end 结束状态 xpos x 位置 ( 参数为画面百分比 )ypos y 位置 alpha 透明信息 [{index:0,duration:3000,start:{xpos:0.112,ypos:0.123,alhpa:1,end{ xpos:0.812,ypos:0.823,alpha, {index:0,duration:3000,start:{xpos:0.112,ypos:0.123,alhpa:1,end{ xpos:0.812,ypos:0.823,alpha ] 跑马灯插件启用后还开放有如下接口 : 接口 addtextitem(name,text,size,color,font,actions,looptime) addimageitem(name,url,width,height, actions,looptime) removeitem(name) 添加文本类型跑马灯添加图片类型跑马灯移除某一个跑马灯使用跑马灯插件时, 需了了解此插件仅提供了了把文字渲染至视频画面上 ( 包括滚动和排列列 ) 的功能代码示例例如下 : 第 8 页共 14 页

11 <script type="text/javascript"> function customfullscreen(){ //TODO 自定义全屏 function onplaypaused(){ // 已暂停播放 function on_cc_player_init( vid, swfid ){ var config = { ; config.player_plugins = { Marquee:{ data:[ { name:"11", type:"text", text:"helloworld", font:" 微软雅黑 ", size:20, color:"0xff0000", looptime:30000, actions:[ { index:0, duration:30000, start:{ xpos:0.112, ypos:0.123, alpha:1, end:{ xpos:0.812, ypos:0.823, alpha:1 ] ] ; var player = getswf( swfid ); player.setconfig( config ); function getswf( swfid ) { if( window.document[ swfid ] ) { return window.document[ swfid ]; else if( navigator.appname.indexof( "Microsoft" ) == -1 ) { if( document.embeds && document.embeds[ swfid ] ) { return document.embeds[ swfid ]; else { return document.getelementbyid( swfid ); 第 9 页共 14 页

12 4.4 问答功能插件启用时在配置中添加插件名称 QustionPlugin, 参数如下 : 参数 QustionPlugin 数组类型, 内容为 object 类型 ( 内容为多个问题和答案 ) id content showtime explaininfo jump backsecond 问题和答案的唯一标识问题内容类型 :String 显示问题的时间点类型 :int 问题答案的解释类型 :String 是否跳过类型 :Boolean; 跳回到的时间类型 :int answers 问题答案类型 :Array 答案每个内容为 id 唯一标识 content 答案内容 right 此答案是否为正确答案代码示例例 : 第 10 页共 14 页

13 <script type="text/javascript"> function customfullscreen(){ //TODO 自定义全屏 function onplaypaused(){ // 已暂停播放 function on_cc_player_init( vid, swfid ){ var config = { ; config.player_plugins = { QustionPlugin:[ { id":10,"content":" 一个问题?","showTime":10,"explainInfo":" 问题答案的解释 ", "jump":false,"backsecond":5, "answers":[ {"id":226,"content":"a. 答案一 ","right":false, {"id":227,"content":"b. 答案二 ","right":true, {"id":228,"content":"c. 答案三 ","right":true, {"id":229,"content":"d. 答案四 ","right":false ] ] ; var player = getswf( swfid ); player.setconfig( config ); function getswf( swfid ) { if( window.document[ swfid ] ) { return window.document[ swfid ]; else if( navigator.appname.indexof( "Microsoft" ) == -1 ) { if( document.embeds && document.embeds[ swfid ] ) { return document.embeds[ swfid ]; else { return document.getelementbyid( swfid ); </script> 附录 1. Flash 和 Javascript 交互播放器器的 HTML 代码中 allowscriptaccess 是一个与 Javascript 交互所必需的属性, 其值必须为 always; object 标签中 id 属性是 IE 内核浏览器器中获取播放器器句句柄的关键, 在非 IE 内核浏览器器中则是 embed 标签的 name 属性 ; 它们的值不不能为空, 并且不不能和页面其他元素重名第 11 页共 14 页

14 可使用下例例中的 getswf 函数来获取播放器器句句柄 ; 另外播放器器回调接口 on_cc_player_init 会传递参数 swfid, 在这个回调接口中使用 getswf( swfid ) 也可获取到播放器器句句柄 <object... id="cc_a5feb0ea05f2100b9c33dc ">... <param name="allowfullscreen" value="true" /> <param name="allowscriptaccess" value="always" /> <embed... name="cc_a5feb0ea05f2100b9c33dc " allowfullscreen="true" allowscriptaccess="always"... /> </object> <script type="text/javascript"> </script> function on_cc_player_init( vid, objectid ){ var player = getswf( objectid ); player.start(); function getswf( swfid ) { if( window.document[ swfid ] ) { return window.document[ swfid ]; else if( navigator.appname.indexof( "Microsoft" ) == -1 ) { if( document.embeds && document.embeds[ swfid ] ) { return document.embeds[ swfid ]; else { return document.getelementbyid( swfid ); 另外, 对于使用 SWFObject 的用户, 可参考以下代码把播放器器嵌入您的网页第 12 页共 14 页

15 // for 1.5 var swfobj = new SWFObject( [PlayerURL], [PlayerID], [PlayerWidth], [PlayerHeight], "10" ); // 如果 [PlayerURL] 不不是带参数的, 就至少必须增加以下参数 : swfobj.addvariable( "siteid", [UID] ); swfobj.addvariable( "vid", [VID] ); swfobj.addparam( "allowscriptaccess", "always" ); swfobj.addparam( "allowfullscreen", "true" ); swfobj.write( [ContainerID] ); // for 2.x var flashvars = { "siteid": [UID], "vid": [VID] ; var params = { "allowscriptaccess": "always", "allowfullscreen": "true" ; var attributes = { "name": [PlayerID], "id": [PlayerID] ; swfobject.embedswf( [PlayerURL], [ContainerID], [PlayerWidth], [PlayerHeight], "10.1.0", [ExpressInstallSwfurl], flashvars, params, attributes ); [PlayerURL] 播放器器地址 ; [PlayerID] 指定页面上播放器器的 id, 可用于播放器器 API 交互 ; [PlayerWidth] 播放器器宽 ; [PlayerHeight] 播放器器高 ; [UID] 用户 ID; [VID] 视频 ID; [ContainerID] 将添加播放器器的容器器的 ID; [ExpressInstallSwfurl] 指定 express install SWF 的 URL 并激活 Adobe express install, 不不指定时可用 false 附录 2. 播放器器错误码代码 102 视频列列表为空 103 无效的视频列列表 108 列列表模式视频信息加载失败 109 视频信息加载失败 110 视频审核中 111 用户流量量用尽 112 用户账号被锁第 13 页共 14 页

16 代码 113 视频处理理中 114 视频被屏蔽 115 视频信息错误 116 无视频文件 205 当前域名不不允许播放 207 授权播放验证未通过 304 测速失败 305 切换清晰度失败 306 播放中播放失败第 14 页共 14 页

PlayerAPI_v1.0.0

PlayerAPI_v1.0.0 Player API 开发指南版本 : 1.0.1 日期 : 2014-01-10 北京梦之窗数码科技有限公司目录 1. 概述!... 1 2. 接口!... 1 3. 配置!... 1 4. 插件介绍!... 4 4.1 字幕插件!... 4 附录 1. Flash 和 Javascript 交互!... 5 附录 2. 播放器错误码!... 5 1. 概述利用 Player API 与