敬告:此 DEMO 演示为开放测试页面,仅用于开发者快速测试体验应用功能,请严格遵守开发者协议,了解更多。
♦ JS-SDK 引用方式:
♦ 普通网页 script 方式加载:下载最新版 jsBridge-v20250529.zip,请在页面上调用 jsBridge 接口之前引用 jsbridge-mini.js 库;
♦ js module 方式引用:npm install ym-jsbridge 具体请参考 npm package
事件监听
• 如需处理接口调用事件,请设置此监听器;
jsBridge.tobid.setListener(function(event, data) {
switch (event) {
//激励视频 jsBridge.tobid.reward(...)
case "reward": {
switch (data.action) {
//加载成功
case "onVideoAdLoadSuccess": {
break;
}
//播放开始
case "onVideoAdPlayStart": {
break;
}
//播放结束
case "onVideoAdPlayEnd": {
break;
}
//激励达成
case "onVideoRewarded": {
jsBridge.toast("奖励已达成!");
break;
}
//点击
case "onVideoAdClicked": {
break;
}
//关闭
case "onVideoAdClosed": {
break;
}
//加载失败,data.message 为失败说明
case "onVideoAdLoadError": {
break;
}
//播放失败,data.message 为失败说明
case "onVideoAdPlayError": {
break;
}
}
break;
}
//插屏广告 jsBridge.tobid.interstitial(...)
case "interstitial": {
switch (data.action) {
//加载成功
case "onInterstitialAdLoadSuccess": {
break;
}
//播放开始
case "onInterstitialAdPlayStart": {
break;
}
//播放结束
case "onInterstitialAdPlayEnd": {
break;
}
//点击
case "onInterstitialAdClicked": {
break;
}
//关闭
case "onInterstitialAdClosed": {
break;
}
//加载失败,data.message 为失败说明
case "onInterstitialAdLoadError": {
break;
}
//播放失败,data.message 为失败说明
case "onInterstitialAdPlayError": {
break;
}
}
}
//横幅广告 jsBridge.tobid.banner(...)
case "banner": {
switch (data.action) {
//加载成功
case "onAdLoadSuccess": {
break;
}
//显示
case "onAdShown": {
break;
}
//点击
case "onAdClicked": {
break;
}
//关闭
case "onAdClosed": {
break;
}
//刷新
case "onAdAutoRefreshed": {
break;
}
//加载失败,data.message 为失败说明
case "onAdLoadError": {
break;
}
//刷新失败,data.message 为失败说明
case "onAdAutoRefreshFail": {
break;
}
}
break;
}
//快手短剧 jsBridge.tobid.ksTube(...)
case "ksTube": {
switch (data.action) {
case "onPageEnter": {
break;
}
case "onPageResume": {
break;
}
case "onPagePause": {
break;
}
case "onPageLeave": {
break;
}
case "onVideoPlayStart": {
break;
}
case "onVideoPlayPaused": {
break;
}
case "onVideoPlayResume": {
break;
}
case "onVideoPlayCompleted": {
break;
}
case "onVideoPlayError": {
break;
}
case "onTubeChannelClick": {
break;
}
case "isNeedBlock": {
break;
}
case "showAdIfNeeded": {
break;
}
}
break;
}
}
//此函数仅用于显示回调参数在本 DEMO 页面上
showResult({
event: event,
data : data
});
});
//请拉到页面底部查看回调数据信息
$('html,body').animate({ scrollTop: $('#view').offset().top }, 500);
/**
回调参数说明:
event //事件代码,字符串类型
data: //事件数据,JSON 对象
{
action : "onClick", //事件名称,字符串类型
message: "" //事件参数,字符串类型
}
**/
权限
//不强制要求权限,但建议您申请,获得权限后能提升广告效果
jsBridge.tobid.requestPermissionIfNecessary();
展示广告
adId:
userId:
//激励视频,setListener 的监听回调 event 为 reward
jsBridge.tobid.reward({
//必须,广告平台上申请的代码位id
adId: "1961395377468416",
//可选,用户标识,用于服务器端通知
userId: "user123",
//可选,广告加载扩展参数,任意键值对
extra: {
key1: "hello",
key2: "world"
},
//可选,广告展示扩展参数,任意键值对
showOptions: {
key1: "123456"
}
}, function(succ, res) {
if (!succ) {
alert(JSON.stringify(res));
}
});
adId:
jsBridge.tobid.reward({
//必须,广告平台上申请的代码位id
adId: "1961395377468416",
//可选,用户标识,用于服务器端通知
userId: "user123",
//可选,广告加载扩展参数,任意键值对
extra: {
key1: "hello",
key2: "world"
},
//预加载广告,不显示。setListener 回调 onVideoAdLoadSuccess 时表示加载成功
preloadAd: true
}, function(succ, res) {
if (!succ) {
alert(JSON.stringify(res));
}
});
jsBridge.tobid.reward({
//显示已成功预加载的广告
showAd: true,
//可选,广告展示扩展参数,任意键值对
showOptions: {
key1: "123456"
}
}, function(succ, res) {
if (!succ) {
alert(JSON.stringify(res));
}
});
adId:
userId:
//插屏广告,setListener 的监听回调 event 为 interstitial
jsBridge.tobid.interstitial({
//必须,广告平台上申请的代码位id
adId: "9424695472372875",
//可选,用户标识
userId: "user123",
//可选,广告加载扩展参数,任意键值对
extra: {
key1: "hello",
key2: "world"
},
//可选,广告展示扩展参数,任意键值对
showOptions: {
key1: "123456"
}
}, function(succ, res) {
if (!succ) {
alert(JSON.stringify(res));
}
});
adId:
userId:
marginStart:
marginEnd:
marginTop:
marginBottom:
//插屏广告,setListener 的监听回调 event 为 banner
jsBridge.tobid.banner({
//必须,广告平台上申请的代码位id
adId: "9875979371577588",
//可选,用户标识
userId: "user123",
//可选,期望的宽度
width: 0,
//可选,期望的高度
height: 0,
//可选,左边距(RTL环境时为右边距)
marginStart: 20,
//可选,右边距(RTL环境时为左边距)
marginEnd: 20,
//可选,上边距
marginTop: 20,
//可选,下边距(如果 >= 0 则居底,否则请设为 -1)
marginBottom: -1
}, function(succ, res) {
if (!succ) {
alert(JSON.stringify(res));
}
});
adId:
freeEpisodeCount:
unlockEpisodeCount:
userId:
userName:
showTitleBar:
disableUnLockTipDialog:
disableAutoOpenPlayPage:
disableShowTubePanelEntry:
hideDetailTitleBar:
hideDetailPlaySeekbar:
hideDetailBottomTitle:
hideDetailBottomDesc:
//快手短剧,setListener 的监听回调 event 为 ksTube
jsBridge.tobid.ksTube({
//广告ID,数字类型
adId: 1234567890,
//每个剧集前N集免费
freeEpisodeCount: 3,
//每次解锁X集
unlockEpisodeCount: 2,
//配置您APP的当前⽤户id
userId: "user123",
//配置您APP的当前⽤户名称
userName: "userABC",
//是否展示顶部TitleBar
showTitleBar: false,
//是否关闭SDK的解锁提示弹框,默认 false
disableUnLockTipDialog: false,
//是否关闭SDK⾃动打开短剧播放⻚,默认 false
disableAutoOpenPlayPage: false,
//是否关闭短剧播放⻚的选集⼊⼝,默认 false
disableShowTubePanelEntry: false,
//隐藏详情标题栏
hideDetailTitleBar: false,
//隐藏详情进度
hideDetailPlaySeekbar: false,
//隐藏详情底部标题
hideDetailBottomTitle: false,
//隐藏详情底部描述
hideDetailBottomDesc: false
}, function(succ, res) {
if (!succ) {
alert(JSON.stringify(res));
}
});
激励视频 adId:
//引用 js 库
//import jsBridge from 'ym-jsbridge'
const showReward = function (jsBridge) {
//设置监听器
jsBridge.tobid.setListener(function (event, data) {
switch (event) {
//激励视频
case "reward": {
switch (data.action) {
//加载成功
case "onVideoAdLoadSuccess": {
//关闭加载动画
layer.closeAll();
break;
}
//失败,data.message 为失败说明
case "onVideoAdLoadError":
case "onVideoAdPlayError": {
//关闭加载动画
layer.closeAll();
//提示失败
layer.msg("广告加载失败:" + data.message);
break;
}
//激励达成
case "onVideoRewarded": {
//奖励达成,客户端仅做简单提示;
//为避免刷单,强烈建议在处理服务器端通知时发放奖励;
jsBridge.toast("奖励已达成!");
break;
}
}
break;
}
}
});
//展示广告
jsBridge.tobid.reward({
//字符串类型,广告平台上申请的代码位id
adId: "1961395377468416",
//可选,用户标识,一般为用户ID,以便在处理服务器通知时给此用户发放奖励
userId: "user123",
}, function (success, res) {
if (success) {
//执行成功,显示加载动画(拉取广告需要一点时间)
layer.load(0, { shade: 0.2 });
} else {
//执行失败
layer.alert(JSON.stringify(res));
}
});
};
showReward(jsBridge);
监听回调数据: