敬告:此 DEMO 演示为开放测试页面,仅用于开发者快速测试体验应用功能,请严格遵守开发者协议,了解更多。
♦ JS-SDK 引用方式:
♦ 普通网页 script 方式加载:下载最新版 jsBridge-v20240925.zip,请在页面上调用 jsBridge 接口之前引用 jsbridge-mini.js 库;
♦ js module 方式引用:npm install ym-jsbridge 具体请参考 npm package
jsBridge.xyVideo.config({ //短视频 APP ID //可在打包模块里面配置,以此 js 接口的配置值优先 app_id : "ba0063bfbc1a5ad878", //可选,用户ID,后期可调用 setUserId 设置 user_id: "13800138000" }, function(succ, data) { alert(succ ? "成功" : "失败:" + JSON.stringify(data)); });
事件监听
• 如需接口调用事件,请设置此监听器;
jsBridge.xyVideo.setListener(function(event, data) { switch (event) { //展示短视频 jsBridge.xyVideo.show(...) case "Video": { switch (data.action) { //展示普通视频 case "onShow": { break; } //展示广告视频 case "onAdShow": { break; } //播放普通视频 case "onStart": { break; } //播放广告视频 case "onAdStart": { break; } //暂停普通视频 case "onPause": { break; } //暂停广告视频 case "onAdPause": { break; } //恢复普通视频(仅支持 Android) case "onResume": { break; } //恢复广告视频(仅支持 Android) case "onAdResume": { break; } //播完普通视频 case "onComplete": { break; } //播完广告视频 case "onAdComplete": { break; } //普通视频出错 case "onError": { break; } //广告视频出错 case "onAdError": { break; } } break; } } //此函数仅用于显示回调参数在本 DEMO 页面上 showResult({ event: event, data : data }); }); //请拉到页面底部查看回调数据信息 $('html,body').animate({ scrollTop: $('#view').offset().top }, 500); /** 回调参数说明: event - 事件代码,字符串类型 data - 事件数据,JSON 对象 { action : "事件名称", //如 onShow、onClose 等,与原生 SDK 的各个 Listener 接口里面的方法名称一致 message: "事件参数" } **/
//移除监听器,不会再收到回调通知 //在需要时可重新调用 setListener jsBridge.xyVideo.removeListener();
展示
//展示短视频,event: Video jsBridge.xyVideo.show(function(succ, data) { if (!succ) { alert(JSON.stringify(data)); } });
用户
//登录 jsBridge.xyVideo.setUserId({ user_id : "13800138000" }, function(succ, data) { alert(succ ? "已登录" : JSON.stringify(data)); });
//退出 jsBridge.xyVideo.setUserId({ //用户ID留空则表示退出 user_id : "" }, function(succ, data) { alert(succ ? "已退出" : JSON.stringify(data)); });
监听回调数据: