属性和接口说明

播放器属性

名称 类型 默认值 说明
wrap String / HTMLElement / 载入播放器的 DOM 元素,支持传入元素或元素选择器 (仅在第一个元素载入)。
vid String / 云点播平台的视频唯一id。
width Number / String 100% 播放器的宽度,支持像素值和百分比两种方式,如200或100%。
height Number / String / 播放器的高度,支持像素值、百分比和自适应三种方式,如100、40%。当值为auto或者为空时,会根据视频比例自动计算高度。
autoplay Boolean / 是否自动播放。
注:目前大多数浏览器都会限制自动播放,该参数可能无效。
loop Boolean false 是否开启循环播放。
forceH5 Boolean / 使用多终端代码时,是否默认使用H5播放器。
注:浏览器不支持H5的情况下还是会使用Flash。
flash Boolean false 是否默认使用Flash播放器。
hideSwitchPlayer Boolean false 是否隐藏H5和Flash播放器的切换按钮。
playsafe String/Function / PC端播放加密视频所需的授权凭证。如何使用详见:播放加密视频
playsafeUrl String / 获取PC端播放加密视频凭证的接口URL。与playsafe参数二选一。
sign String / 移动端播放加密视频所需的签名。如何使用详见:播放加密视频
ts Number / 移动播放加密视频需传入的时间戳。
viewerInfo Object / 自定义观众信息。设置后,播放器上报的观看行为日志中会附带观众信息。详见:观众信息设置与统计
video_align String / 播放器内视频画面的对齐方式,默认是居中显示,但可通过该参数来控制。取值:{top,bottom,left,right},分别对应顶部对齐,底部对齐,左对齐和右对齐。
loading_bg_img String / 视频首图的URL。
cover_display String scaleToFill 封面图的显示方式:scaleToFill 铺满,scaleAspectFit 等比自适应,scaleAspectFill 等比铺满。
cover_opacity Number 70 封面图蒙层不透明度,取值范围:[0,100]。
showHd Boolean true 是否显示清晰度选择按钮。
show_rate Number / 允许选择的最高清晰度,取值:{1,2}。值为1时,只显示流畅,值为2时,可选流畅和高清。
showAuto Boolean true 是否显示清晰度选择中的”自动“选项。
df Number - 视频播放默认的清晰度,取值:{0,1,2,3},分别对应自动、流畅、高清、超清。
speed Boolean/Array true 当speed参数值为boolean类型时,代表是否显示倍速切换的按钮。当参数值为数组时,则代表倍速切换的可选速率。最多可设置6个速率,取值范围:(0,3]。PC端默认值为:[2, 1.5, 1.2, 0.5],移动端默认值为:[1, 1.5, 2]。
showLine String on 是否显示线路选择按钮,取值:{on,off}。
注:仅在移动端生效。
volume Number 0.75 默认音量大小,取值范围:(0,1),播放器会记录上一次播放的音量。
allowFullscreen Boolean true 是否允许全屏播放。为false时会隐藏全屏按钮(全屏的API依然可用)。
注:仅在PC端生效。
fullscreenProxy Boolean false 是否使用全屏代理,为true时点击全屏不会调用全屏的API,会触发window.onFullscreenProxy(vid, toFullscreen)事件,由开发者自行做全屏处理,适合在全屏状态下叠加用户自定义的元素的场景。
full_page_screen Boolean false 是否显示网页全屏按钮。需配置window.onFullPageScreen 事件回调做相应页面全屏处理。
pictureInPicture Boolean false 是否在控制栏显示画中画按钮。
注:仅在PC H5播放器生效,仅在播放非加密视频时生效。
screenshot Boolean false 是否显示视频截图按钮。
注:仅在PC端生效。
skinLocation Number 1 播放器控制栏显示位置:0 不显示,1 视频区域内,2 视频区域外。
注:仅在PC端生效。
hideRepeat Boolean false 是否隐藏播放结束后的重播按钮。
ban_ui String off 是否隐藏播放器皮肤控制栏,取值:{on,off}。
ban_seek String off 是否禁止拖拽进度条,取值:{on,off}。
注:Android系统下各厂商浏览器表现不一致,该参数可能不生效。
ban_seek_by_limit_time String off 是否禁止拖拽进度至视频未播放到的位置,取值:{on,off}。为on时只可在已播放过的进度范围内拖拽(向前拖拽)。
ban_preview_video String off 是否禁止鼠标在进度条悬浮时显示预览画面的缩略图,取值{on,off},为on时鼠标在悬浮进度条时不显示预览缩略图
keyboardSeekTime Number 15000 键盘每按一次方向键,视频前进/后退的时间。单位:毫秒。
watchStartTime Number / 播放开始时间,表示视频从第几秒开始播放,参数值需小于视频时长。
watchEndTime Number / 播放结束时间,表示视频播放到第几秒结束,设置该值后,只能在开始时间至结束时间范围内进行进度条的拖拽。
参数值需大于watchStartTime且小于视频时长,如果参数值小于watchStartTime,则watchStartTime失效。
start Number / 截取视频的一部分作为一个独立的视频,如原视频时长60秒,设定start=20后,则视频显示为40秒,并且从原视频的第20秒开始播放。
通常配合end参数一起使用(子视频功能)。
end Number / 截取视频的一部分作为一个独立的视频,如原视频时长60秒,设定start=20,end=50后,则视频显示为30秒,并且从原视频的第20秒开始播放,到原视频的50秒结束播放。
preview Boolean false 是否使用预览模式,到达预览时长后会停止播放,预览时长可在管理后台配置。
history_video_duration Number 5 默认时长超过5分钟的视频会开启续播功能,可通过此参数修改,单位:分钟。视频前10秒和最后10秒的播放过程中不会记录续播时间点。
ban_history_time String off 是否禁用续播功能,取值:{on,off}。
preloadDataSize Number 15000 预加载的数据量,会根据实际视频时长和清晰度加载切片数量,取值范围:[500,60000],单位:KB。
注:仅在PC端对HLS视频(加密视频)有效。
preloadDurationLength Number / 视频预加载最大时长,单位:秒。
url String / 第三方的视频资源地址,不可与vid同时设置。
logo Object / 播放器Logo配置参数,详见:播放器Logo
teaser_show Number / 是否播放片头:0 不播放,1 播放。片头可在管理后台进行设置。
teaser_time Number / 片头显示时长。
teaser_url String / 片头URL,视频只支持mp4格式。
teaserSkip Boolean false 是否显示跳过片头的按钮。
注:由于视频层级问题,该参数在部分移动端浏览器下可能不生效。
tail_show Number / 是否播放片尾:0 不播放,1 播放。片尾可在管理后台进行设置。
tail_time Number / 片尾显示时长。
tail_url String / 片尾URL,视频只支持mp4格式。
tailSkip Boolean / 是否显示跳过片尾的按钮。
ban_ad Boolean false 是否禁止播放广告。
ban_ad_time Boolean false 是否隐藏广告倒计时。
adMatter Array / 广告配置参数,详见:广告设置
adSkip Boolean false 是否显示跳过广告的按钮。
rightMenu Array / 播放器右键菜单配置,例如:rightMenu: [{rightName: '右键菜单显示名称', rightUrl: '菜单点击跳转URL', callback: function(){console.log('hi')}},{rightName: '右键菜单二',rightUrl: '', callback: function(){console.log('hello')}}]
lang String zh_CN 播放器语言,支持中英文,取值:{zh_CN,en}。
priorityMode String video 默认使用视频模式还是音频模式,取值:{video,audio}。
注:只有额外转音频的视频才可以切换音视频模式。
videoMode Boolean true 参数值为false时,会启用音频模式。
注:仅在PC端生效,没有额外转音频的也会启用音频模式。
audioMode Boolean false 是否启用音频模式
hideAudioMode Boolean false 是否隐藏音视频切换按钮。
is_interaction String on 是否在视频播放时弹出管理后台设置的问答题目。取值:{on,off}。详见:问答弹题功能
ban_record_interaction_right_answer String off 是否禁止播放器缓存问答提交记录,取值:{on,off}。设置为”on“时每次播放视频都需重新答题。
title_of_right_answer_explain String / 问答题目回答正确时的提示文案。
title_of_wrong_answer_explain String / 问答题目回答错误时的提示文案。
pptEnable Boolean false 是否启用课件三分屏播放模式。详见:课件三分屏播放
mainScreen String ppt 课件三分屏播放时的主屏,取值:{ppt,video}
subWidth Number 355 课件三分屏播放时副屏的默认宽度
subHeight Number 200 课件三分屏播放时副屏的默认高度
pptVisible Boolean true 课件三分屏初始化时是否需要显示ppt
srt_caption_txt_size Number 20 字幕字号,取值范围:[20,40],单位:px。
srt_caption_txt_height Number 20 字幕距离播放器底部的高度,单位:px。
srt_caption_base_width Number 1280 字幕字号会随播放器尺寸变化。该值为播放器的基准宽度。
srt_caption_base_height Number 720 字幕字号会随播放器尺寸变化。该值为播放器的基准高度。
code String / 跑马灯自定义的code值,详见:授权播放和视频跑马灯
marqueeCheck Boolean / 为true时会检测跑马灯是否被篡改,并报016错误。
useH5Page Boolean true 当参数值为true时代表启用同层播放。详见:H5同层播放
ignoreIE Boolean false 是否在IE浏览器(包括360、QQ等浏览器的兼容模式)中禁用HTML5播放器。
player_id String / 播放器ID,设置后会使用对应播放器的设置。
注:该功能需额外开通才能生效。

播放器接口

API需要在播放器初始化完成之后调用,比如:

player.on('s2j_onPlayerInitOver',function(e) {
    player.j2s_seekVideo(100);
 });  

接口列表

名称 参数及类型 返回值及类型 说明
j2s_pauseVideo / / 暂停播放。
j2s_resumeVideo / / 恢复播放当前视频。
j2s_stopVideo / / 停止播放当前视频,并显示结束画面。
j2s_seekVideo (Number) / 跳转到某个时刻播放,参数单位为:秒。
j2s_getDuration / Number 获取视频总时长,返回值单位为:秒。
j2s_getCurrentTime / Number 获取视频当前的播放时刻,返回值单位为:秒。
j2s_realPlayVideoTime / Number 获取当前视频已播放的时长,不包含广告、片头、暂停、片尾等时间。
j2s_getFlowCount / Number 获取当前视频播放消耗的流量,单位:字节。仅Flash播放器支持。
j2s_setVolume (Number) / 设置视频播放音量,取值范围(0,1)。
j2s_realPlayStatus / Object 获取实时播放状态,返回的json格式字符串包含以下字段:
pid 每次播放行为生成的唯一ID,后台的观看日志也包含该字段
vid 视频ID
playduration 当前播放时长
timestamp 当前时间戳
sign 签名,计算方式请咨询技术支持。
changeVid (Object) / 切换到下一个视频,详见:视频切换
switchBitrate (Number) / 切换清晰度,参数取值{0,1,2,3},分别对应自动、流畅、高清、超清。
toggleFullscreen / / 全屏/退出全屏 切换
toggleFullPageScreen / / 切换网页全屏按钮状态
changeRepeat (Boolean) / 当参数值为true时,视频结束播放后隐藏重播按钮。
switchMain (String) / 课件三分屏播放时,切换PPT或视频至主屏。取值:{ppt,player}。
setMode (String) / 切换音视频模式,取值:{video,audio}。
注:只有额外转音频的视频才可以切换音视频模式。
getCurrentMode / String 返回当前播放模式,video 视频模式,audio 音频模式。
toFlash / / 切换至Flash播放器,只有PC端H5播放器才可调用该方法。
toHTML5 / / 切换至H5播放器,只有Flash播放器才可调用该方法。
on (String,Funciton) / 绑定监听事件
destroy / / 销毁播放器实例
getScreenshotData(); / Base64的图片数据 获取当前视频画面的截图数据,仅支持PC H5播放器调用,需设置播放器参数allowGetScreenshotData为true

播放器事件

名称 说明
s2j_onPlayerInitOver 播放器初始化完毕时触发。播放器提供的方法需要在此事件发生后才可以调用。参数返回vid
s2j_onReadyPlay 在已加载足够的数据能够开始播放视频时触发,参数返回vid
注:移动端不触发此事件。
s2j_onPlayStart 视频初次播放时触发,参数返回vid。
s2j_onVideoPlay 视频初次播放或由暂停恢复播放时触发,参数返回vid。
s2j_onVideoPause 视频暂停时触发,参数返回vid。
s2j_onVideoSeek 视频拖拽进度时触发,参数返回开始、结束seek的时间点以及vid。
s2j_onPlayOver 当前视频播放完毕时触发,参数返回vid。
s2j_volumeChange 播放音频发生变化时触发,参数返回vid、变化后的音量。
s2j_onFullScreen 播放器进入全屏时触发,参数返回vid。
s2j_onNormalScreen 播放器退出全屏时触发,参数返回vid。
s2j_onPlayerError 播放出现错误时触发,参数返回vid。
HTML5Load Flash切换至H5播放器时触发。
flashLoad PC端H5播放器切换至Flash播放器时触发。
serverError 发生业务逻辑错误时触发,比如授权验证失败、域名黑白名单验证不通过等错误。参数返回事件名称和错误代码。
onChangeMode 音视频模式切换时触发,参数返回vid,切换后模式以及切换前模式。
onFullscreenProxy 当设置fullscreenProxy参数为true时,点击全屏按钮不会调用全屏api,会触发 window.onFullscreenProxy(vid, toFullscreen) 事件,调用者自行做全屏处理,适合在全屏状态下叠加用户自定义的元素。
onFullPageScreen 当设置full_page_screen为true时,点击网页全屏按钮会触发window.onFullPageScreen(vid, currentStatus) 事件,调用者自行做网页全屏处理。

注:由于一些历史原因,Web三端播放器(Flash、PC H5和移动端H5)的事件返回参数尚未对齐,上表中以PC H5播放器为准。

通过播放器实例的on方法订阅:

player.on('s2j_onPlayerInitOver', (...params) => {
    console.log('播放器数据初始化完毕:',params);
});

通过播放器实例的off方法取消订阅:

player.off('s2j_onPlayerInitOver', () => {
    console.log('取消订阅');
});

错误代码 

错误代码 说明
#001 套餐过期,请联系客服续期。
#002 套餐内流量已用完,请联系客服购买流量。
#003 视频配置文件加载失败。一般是由于网络问题导致无法加载视频配置文件,建议检查/切换网络并重试。
#004 视频不存在。请检查vid是否正确,视频是否已经被删除。
#005 视频审核不通过。只有“已发布”状态的视频才可以播放。
#006 域名黑白名单验证不通过。请检查管理后台的播放域名设置。
#007 视频文件加载失败。一般是由于网络问题导致无法加载视频文件,建议检查/切换网络并重试。
#008 视频文件加载超时。一般是由于网络问题导致加载视频文件超时,建议检查/切换网络并重试。
#009 视频正在审核中。只有“已发布”状态的视频才可以播放。
#010 视频正在编码中。只有“已发布”状态的视频才可以播放。
#011 播放器皮肤加载失败。建议检查/切换网络并重试。
#012 跑马灯加载错误。请检查跑马灯接口返回的参数是否正确,详见:授权播放和视频跑马灯
#013 视频授权播放认证失败。请检查授权认证接口,详见:授权播放和视频跑马灯
#014 Flash播放器没有JavaScript运行权限。请尝试升级浏览器至最新版本或更换浏览器。
#015 JavaScript运行错误。请尝试升级浏览器至最新版本或更换浏览器。
#016 跑马灯被篡改。
#020 playsafeUrl接口请求失败。请检查playsafeUrl参数的接口服务是否正常,详见:播放加密视频
#024 基于视频版权保护考虑,播放器会禁止加密视频在某些自带录屏功能的浏览器上播放。请更换其它浏览器。
#10000 视频被禁止播放,请联系管理员
以上内容是否对您有帮助?根本没有帮助文档较差文档一般文档不错文档很好
Loading...

概览

产品介绍

播放器SDK是保利威视频云服务的重要组成部分,基于保利威强大的后台能力和视频处理技术,为用户提供简单、快速、安全、稳定的视频播放服务。播放器SDK还深度融合了保利威视频云业务,如加密播放、防录屏、画质和线路切换、嵌入广告、三分屏教学、试看、数据统计等功能,覆盖多种应用场景,让用户轻松聚焦于业务发展本身,畅享极速高清播放体验。

本文档是介绍保利威云点播服务的Web播放器,通过提供简单、便捷的嵌入方式和灵活的接口,帮助开发者快速与自有Web应用集成,实现视频播放功能。

image-20200527144014829

核心优势

  • 简单、易集成:通过统一的嵌入代码,只需视频ID即可播放视频,快速与自有业务集成。
  • 丰富的功能:除了基础播放功能,播放器集成了常用的视频相关业务功能,可极大减少用户自身的开发量。
  • 业内领先的视频版权保护体系:从视频加密、防盗播、防翻录等多个层级对视频进行全方位安全防护,详见:PlaySafe视频版权保护体系
  • 云端一体化:云端加密、播放端解密,保证视频安全。播放端采集数据、云端分析,为业务运营提供支持。
  • 全终端适配:PC H5、Flash、移动H5三端播放器智能切换,适配几乎所有的终端设备和浏览器。

功能清单

功能点 功能说明
格式和编码 支持MP4、HLS(M3U8)、FLV、保利威自有知识产权的加密视频格式和MP3音频格式,支持H264视频编码和AAC音频编码。
播放器皮肤 Web播放器包含多套完整皮肤UI,可在点播管理后台-->播放器-->皮肤设置中进行选择和自定义设置。
封面图 支持设置视频播放前的封面图。
URL播放 除了支持点播提供的vid方式播放,还支持本地视频和网络视频的URL方式播放。支持播放的文件格式取决于当前浏览器。
播放控制 支持预加载、自动播放、播放/暂停、进度拖拽、全屏播放、循环播放和切换视频等播放控制功能。
音量调节 支持实时调节系统音量。
清晰度切换 支持视频转码后的多路清晰度流切换,播放器内置自动重试机制,某个清晰度视频播放失败时会尝试切换其它清晰度。
多线路切换 支持多条CDN线路的切换,播放器内置自动重试机制,某个CDN线路播放失败时会尝试切换其它线路。
倍速播放 支持0~3倍的视频播放速度切换。
音视频切换 如果账号开通了额外转码音频文件的功能,则支持视频/音频模式的相互切换。
续播 从上一次播放结束的时间点继续播放。
播放器Logo 支持设置自定义的播放器Logo进行品牌曝光。
片头、片尾播放 支持设置图片或视频类型的片头和片尾。
嵌入广告 支持嵌入片头、片尾、暂停和弹窗类型的广告。
图文推广 支持嵌入图文推广链接。
视频试看 支持以视频试看,播放到设置的预览时长后会停止播放。
子视频播放 截取视频的一部分片段进行播放(不会生成新视频)。
观看密码 支持输入正确的密码才可观看视频。
播放域名校验 支持播放域名黑白名单设置。
授权播放 支持播放器请求自定义的授权接口,只有授权通过才可以播放视频。
跑马灯 支持设定的文字内容在视频上不规则显示,以达到防盗录、信息提示等目的。
播放加密视频 支持经过点播转码、切片加密后的加密视频播放。
浏览器防录屏 监测到浏览器自身或第三方浏览器插件开始录屏后,自动停止播放。
视频打点 支持对视频添加打点信息并在播放器进度条显示相应标记,方便观众快速定位重要内容。
双语字幕 支持上传字幕文件的自定义样式显示,支持显示双语字幕。
弹幕 支持发送、显示弹幕信息。
问答弹题 支持播放过程中弹出问答题目。
课件三分屏 支持视频、课件(PPT、PDF格式)、课件大纲三分屏显示。
观众信息收集 支持设置信息登记表单,观众登记后才可继续观看视频。
右键菜单自定义 支持自定义播放器右键菜单选项,支持链接和函数两种类型。
视频截图 支持截取播放画面的任意一帧。
画中画 支持视频”跳出“浏览器,悬浮在屏幕上方播放。
一键分享 支持一键分享至微信、微博等社交平台。
国际化 支持中/英文。
VR视频播放 支持播放VR视频。
统计 支持观看行为数据上报,可在管理后台查看数据统计。
以上内容是否对您有帮助?根本没有帮助文档较差文档一般文档不错文档很好
Loading...

集成文档

保利威云点播Web播放器同时支持Flash和HTM5两种播放模式,并可以根据终端和浏览器环境自动选择最优播放模式,实现了视频播放效果的多平台统一体验。支持FLV、MP4、HLS等主流视频格式和协议,并结合保利威云点播服务,提供加密视频播放等功能。

适配情况

保利威云点播的转码服务,在默认情况下会把上传的视频转码出以下几种格式:

  • 非加密视频:MP4(H5播放)、FLV(Flash播放)
  • 加密视频:HLS(H5播放)、PTS(Flash播放)

视频格式与平台支持情况如下:

浏览器/播放器 Flash播放器(已停止更新) H5播放器
Chrome
Firefox
Edge
IE IE8+ IE11+ for Windows 8.1+
Safari
iOS Safari ×
iOS 微信、QQ ×
Android 微信、QQ ×
Android 其它 ×
  1. PC端IE11( Windows 8.1+)及以上浏览器支持HTML5播放,低版本IE将切换至FLASH播放器;移动端不支持Flash播放器。
  2. 视频编码格式仅支持H.264编码。
  3. 如果对视频设置了不转码的话,播放器会直接播放视频源文件,能否正常播放取决于观众浏览器支持的视频格式。

已知的H5适配问题

  1. 设置自动播放无效,不会自动播放

    • 移动端浏览器中音频自动播放一直是禁止的,目前通用的办法是通过用户手动触发播放(例如监听用户的点击事件并调用play方法),但不排除一些特性的浏览器和webview允许自动播放。
    • 桌面端Chrome 55+、 Safari 11+版本的浏览器也都限制自动播放。
  2. 移动端H5播放器自带的皮肤在部分情况下无法显示,导致无法使用播放器提供的部分控制功能(如画质/倍速切换等)。
    • iOS设备在全屏播放视频时,会强制使用系统的播放器,此时无法显示自带的播放器皮肤。
    • 由于Android系统有众多不同的定制版本,每个版本对H5 video标签的实现都有差别,而且大多数的国内浏览器厂商,都会在视频播放时挟持video标签,由浏览器内置播放器播放视频,所以在Android上播放视频的一致性相比iOS要差很多。在无法显示自带播放器皮肤情况下,可以通过播放器提供的API接口来进行播放控制。
  3. 音量调节功能在iOS和Android浏览器上无效。
  4. 倍速播放功能,部分移动端浏览器不支持设置倍速,功能会失效,比如android微信。

快速集成代码

不依赖于任何的前端js库,只需要在页面中引用如下js文件,就可以进行播放器的初始化。

js

<div id="player"></div>
<script src="//player.polyv.net/script/player.js"></script>
<script>
  var player = polyvPlayer({
    wrap: '#player',
    width: 800,
    height: 533,
    vid: '88083abbf5bcf1356e05d39666be527a_8' ,
  });
</script>

默认使用H5播放器,在ie及其他不支持的浏览器下自动切换flash

需要兼容ie9以下的播放器,可以使用下面代码(不再推荐,原因详见:关于Flash Player即将停止服务的通知

<script src='//player.polyv.net/script/polyvplayer.min.js'></script>
<div id='player'></div>
<script>
var player = polyvObject('#player').videoPlayer({
    'width':'600',
    'height':'450',
    'vid' : '88083abbf5bcf1356e05d39666be527a_8' ,
});
</script>

vue

<template>
  <div id="player"></div>
</template>
<script>
export default {
  data() {
    return {
      vodPlayerJs: 'https://player.polyv.net/script/player.js',
      vid:'88083abbf5bcf1356e05d39666be527a_8',
    };
  },

  mounted(){
      this.loadPlayerScript(this.loadPlayer);
  },

  methods: {
    loadPlayerScript(callback) {
      if (!window.polyvPlayer) {
        const myScript = document.createElement('script');
        myScript.setAttribute('src', this.vodPlayerJs);
        myScript.onload = callback;
        document.body.appendChild(myScript);
      } else {
        callback();
      }
    },

    loadPlayer() {
      const polyvPlayer = window.polyvPlayer;
      this.player = polyvPlayer({
        wrap: '#player',
        width: 800,
        height: 533,
        vid: this.vid ,
      });
    }
  },
  destroyed() {
    if (this.player) {
        this.player.destroy();
    }
  }
};
</script>

react

import React from 'react';

class Player extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    if(!window.polyvPlayer){
      this.loadScript('https://player.polyv.net/script/player.js')
      .then(() =>{
        this.loadPlayer();
      });
    }
  }

  componentWillUnmount() {
    if(this.player){
      this.player.destroy();
    }
  }

  loadPlayer() {
    this.player = window.polyvPlayer({
      wrap: '.player',
      width: '100%',
      height: '100%',
      vid: '88083abbf5bcf1356e05d39666be527a_8',
    });
  }

  loadScript(src) {
    const headElement = document.head || document.getElementsByTagName('head')[0];
    const _importedScript = {};

    return new Promise((resolve, reject) => {
      if (src in _importedScript) {
        resolve();
        return;
      }
      const script = document.createElement('script');
      script.type = 'text/javascript';
      script.onerror = err => {
        headElement.removeChild(script);
        reject(new URIError(`The Script ${src} is no accessible.`));
      }
      script.onload = () => {
        _importedScript[src] = true;
        resolve();
      }
      headElement.appendChild(script);
      script.src = src;
    })
  }

  render() {
    return (
      <div className="wrap">
        <div className="player"></div>
      </div>
    )
  }
}

export default Player;

参数

参数 类型 默认值 说明
wrap string / HTMLElement - 页面上存在需要载入播放器的DOM元素或css选择器
width number / string 100% 播放器的宽度,支持像素值和百分比两种类型
height number / string auto 播放器的高度,支持像素值和百分比两种类型
vid string - 云点播平台的视频唯一id

更多参数请查看 属性和接口说明

其它分支版本

除了线上通用版本的播放器外,我们还提供一些其他分支版本的播放器。这些分支版本存在的原因可能有:

  • 当前分支版本处于公测阶段,公测期过后会合并或替换通用版本。
  • 分支版本具有的某些特性或采用的技术实现方案无法合并到通用版本。
  • 分支版本针对某类场景进行了功能定制,只适用于部分客户。

目前可用的Web播放器分支版本有:

VRM10+版本播放器

  • VRM10+版本播放器采用了新的技术实现方案,大大提升了PC端H5播放器的安全性,点此了解详情
  • 不再兼容IE浏览器
  • 播放器支持的参数、接口、事件与线上通用版本播放器保持一致,只需替换js文件的地址即可使用:由<script src="//player.polyv.net/script/player.js"></script>替换为<script src="//player.polyv.net/resp/vod-player-drm/latest/player.js"></script>

移动端H5播放器2.0版本

  • 移动端H5播放器2.0版本采用了新的技术架构和UI设计,解决了线上通用版本在移动端H5上的一些顽疾,比如部分机型微信下只能竖屏全屏的问题,小程序webview播放页面的业务域名限制等。
  • 2.0版本已完成内部测试,目前处于公测阶段,后续会替换线上通用版本。
  • 2.0版本播放器支持的参数、接口、事件与线上通用版本播放器保持一致,只需替换js文件的地址即可使用:由<script src="//player.polyv.net/script/player.js"></script>替换为<script src="//player.polyv.net/resp/vod-player/latest/player.js"></script>
以上内容是否对您有帮助?根本没有帮助文档较差文档一般文档不错文档很好
Loading...