WebApp快捷打包
视频播放器

敬告:此 DEMO 演示为开放测试页面,仅用于开发者快速测试体验应用功能,请严格遵守开发者协议,了解更多

JS-SDK 引用方式:

♦ 普通网页 script 方式加载:下载最新版 jsBridge-v20241118.zip,请在页面上调用 jsBridge 接口之前引用 jsbridge-mini.js 库;

♦ js module 方式引用:npm install ym-jsbridge 具体请参考 npm package

mp4点播 Dream It Possible
视频来自华为
热度 678
mp4点播 阿里云
视频来自阿里云
热度 123
mp4点播 Motor Live
motorlive.tv
热度 234
hls(m3u8)点播
motorlive.tv
热度 234
flv点播
motorlive.tv
热度 234
hls(m3u8) 直播流
视频来自百度云
热度 234
rmtp 直播流
视频来自百度云
热度 234
flv 直播流
视频来自百度云
热度 234

addPlayer 添加播放器到当前网页

//添加播放器,获得 playerId
jsBridge.video.addPlayer({
  //必须,数字类型,指定播放器定位置(px)
  top   : 0,
  left  : 0,
  //必须,数字类型,宽度(px), -1 为适应屏幕宽度
  width : -1,
  //必须,数字类型,高度(px),-1 为适应屏幕高度
  height: playerPlaceHolder.height(),
  //可选,布尔类型,全屏的时候是否保持屏幕方向不变
  //默认 false 强制横屏
  //true 保持屏幕方向不变
  originalFullScreen: false,
  //可选主题 blue, green, orange, red
  theme : 'blue',
  //可选,播放器事件,如不接收事件可不提此属性
  //回调参数:
  //playerId 整数类型,播放器id(必有)
  //event 整数类型,事件(必有),参考事件说明
  //data 事件对应的数据(可选)
  onEvent: function(playerId, event, data) {
    console.log(playerId, event, data);
  }
}, function(playerId) {
  if (playerId > 0) {
    alert(playerId);
  } else {
    alert("添加失败");
  }
});

/*
onEvent 回调参数 event 事件说明:

1  E_Started     已开始播放
2  E_Paused      已暂停
3  E_Stopped     已停止
4  E_FullScreen  进入全屏
5  E_SmallScreen 退出全屏

10 E_Prepared          已缓冲完成,可立即播放
11 E_Completed         已播放结束
12 E_AutoPlay          开始自动播放
13 E_Replay            开始重播
14 E_TimeExpired       加载超时
15 E_FirstFrameStart   显示首帧
16 E_SeekCompleted     寻时完成
17 E_BufferingUpdated  更新缓冲区
99 E_Error             错误
*/

removePlayer 移除播放器

//从当前网页移除指定的播放器
jsBridge.video.removePlayer(playerId);

resource 设置播放资源

jsBridge.video.resource({
  //指定播放器id,数字类型,必须
  //即调用 addPlayer 返回的 id
  player  : playerId,
  //视频链接,字符串类型,必须
  url     : 'http://player.alicdn.com/video/editor.mp4',
  //名称,字符串类型,可选,默认无
  title   : '测试视频',
  //封面图链接,字符串类型,可选,默认无
  cover   : 'https://i.cdn.yimenapp.com/sys/player.png',
  //是否自动播放,可选,默认 true
  autoplay: true
});

start 播放

//播放
jsBridge.video.start(playerId);

pause 暂停

//暂停
jsBridge.video.pause(playerId);

stop 停止

//停止
jsBridge.video.stop(playerId);

fullScreen 全屏

//全屏
jsBridge.video.fullScreen(playerId);
  • 评论一
  • 评论二
  • 评论三
  • 评论四
  • 评论五
  • ...
  • demo