敬告:此 DEMO 演示为开放测试页面,仅用于开发者快速测试体验应用功能,请严格遵守开发者协议,了解更多。
♦ JS-SDK 引用方式:
♦ 普通网页 script 方式加载:下载最新版 jsBridge-v20251019.zip,请在页面上调用 jsBridge 接口之前引用 jsbridge-mini.js 库;
♦ js module 方式引用:npm install ym-jsbridge 具体请参考 npm package
jsBridge.xyAd.config({
//广告 APP ID
//可在打包模块里面配置,以此 js 接口的配置值优先
app_id : "ba0063bfbc1a5ad878",
//可选,用户ID,后期可调用 setUserId 设置
user_id: "13800138000"
}, function(succ, data) {
alert(succ ? "成功" : "失败:" + JSON.stringify(data));
});
事件监听
• 如需接口调用事件,请设置此监听器;
jsBridge.xyAd.setListener(function(event, data) {
switch (event) {
//激励视频 jsBridge.xyAd.rewardVideoAd(...)
case "RewardVideoAd": {
switch (data.action) {
//广告加载成功
case "onAdLoad": {
//事件参数 data.message
break;
}
//视频素材缓存成功
case "onVideoCached": {
break;
}
//广告页面展示
case "onAdShow": {
break;
}
//广告奖励有效性回调,onReward 一定在 onAdClose 之前,但不保证与 onVideoComplete 的先后顺序,建议在 onAdClose 中判断 onReward 已回调才给用户奖励
case "onReward": {
break;
}
//广告被点击
case "onAdClick": {
break;
}
//广告播放完毕
case "onVideoComplete": {
break;
}
//广告被关闭
case "onAdClose": {
break;
}
//广告出错
case "onError": {
break;
}
//播放出错(仅支持 iOS)
case "onAdPlayError": {
break;
}
}
break;
}
//插屏广告 jsBridge.xyAd.interstitialAd(...)
case "InterstitialAd": {
switch (data.action) {
//广告加载成功
case "onAdLoad": {
break;
}
//广告页面展示
case "onAdShow": {
break;
}
//广告被点击
case "onAdClick": {
break;
}
//广告被关闭
case "onAdClose": {
break;
}
//广告出错
case "onError": {
break;
}
}
break;
}
//横幅广告 jsBridge.xyAd.bannerAd(...)
case "BannerAd": {
switch (data.action) {
//广告加载成功
case "onAdLoad": {
break;
}
//广告页面展示
case "onAdShow": {
break;
}
//广告被点击
case "onAdClick": {
break;
}
//广告被关闭
case "onAdClose": {
break;
}
//广告出错
case "onError": {
break;
}
}
break;
}
//快手短视频 jsBridge.xyAd.feedVideo(...)
case "FeedVideo": {
switch (data.action) {
//展示普通视频(仅支持 Android)
case "onShow": {
break;
}
//展示广告视频(仅支持 Android)
case "onAdShow": {
break;
}
//播放普通视频
case "onStart": {
break;
}
//播放广告视频
case "onAdStart": {
break;
}
//暂停普通视频
case "onPause": {
break;
}
//暂停广告视频
case "onAdPause": {
break;
}
//恢复普通视频
case "onResume": {
break;
}
//恢复广告视频
case "onAdResume": {
break;
}
//播完普通视频
case "onComplete": {
break;
}
//播完广告视频
case "onAdComplete": {
break;
}
//普通视频出错
case "onVideoError": {
break;
}
//广告视频出错
case "onAdVideoError": {
break;
}
}
break;
}
//横版视频(仅支持 Android) jsBridge.xyAd.hVideo(...)
case "HVideo": {
switch (data.action) {
//出错
case "onError": {
break;
}
}
break;
}
//互动广告(仅支持 Android) jsBridge.xyAd.hVideo(...)
case "Interactive": {
switch (data.action) {
//出错
case "onError": {
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.xyAd.removeListener();
展示广告
unit_id:
//激励视频,event: RewardVideoAd
jsBridge.xyAd.rewardVideoAd({
//必须,字符串类型,广告ID
unit_id : "{{rewardVideoAd.id}}"
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
unit_id:
//插屏广告,event: InterstitialAd
jsBridge.xyAd.interstitialAd({
//必须,字符串类型,广告ID
unit_id: "{{interstitialAd.id}}",
//必须,数字类型,广告宽度(高度自适应)
width : 480
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
unit_id:
width:
height:
top:
//横幅广告,event: BannerAd
jsBridge.xyAd.bannerAd({
//必须,字符串类型,广告ID
unit_id: "{{bannerAd.id}}",
//必须,数字类型,期望的广告高度
width : {{bannerAd.width}},
//必须,数字类型,期望的广告宽度
height : {{bannerAd.height}},
//可选,数字类型,广告位置上边距,默认 0
top : {{bannerAd.top}}
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
//横幅广告
jsBridge.xyAd.bannerAd({
remove: true
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
unit_id:
//快手短视频,event: FeedVideo
jsBridge.xyAd.feedVideo({
//广告ID
unit_id: "{{feedVideo.id}}"
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
unit_id:
//横版视频,仅支持 Android,event: HVideo
jsBridge.xyAd.hVideo({
//标题
title : "横版视频",
//主题颜色,light 浅色,dark 深色
theme : "light",
//广告ID
unit_id: "{{hVideo.id}}"
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
//横版视频,仅支持 Android,event: HVideo
jsBridge.xyAd.hVideo({
//标题
title : "横版视频",
//主题颜色,light 浅色,dark 深色
theme : "dark",
//广告ID
unit_id: "hf1"
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
unit_id:
//互动广告,仅支持 Android,event: Interactive
jsBridge.xyAd.interactive({
//广告ID
unit_id: "{{interactive.id}}"
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
url:
//CPA 任务,event: 无
jsBridge.xyAd.cpa({
//标题
title: "CPA 任务",
//主题颜色,light 浅色,dark 深色
theme: "light",
//H5 页面链接
url : "{{cpa.id}}"
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
//CPA 任务
jsBridge.xyAd.cpa({
//标题
title: "CPA 任务",
//主题颜色,light 浅色,dark 深色
theme: "dark",
//H5 页面链接
url : "http://dev-qss3-webv.foretellmaster.com/ditch/task?union_id=10000&hideHeader=1"
}, function(succ, data) {
if (!succ) {
alert(JSON.stringify(data));
}
});
用户
user_id:
//登录
jsBridge.xyAd.setUserId({
user_id : "{{setUserId.id}}"
}, function(succ, data) {
alert(succ ? "已登录" : JSON.stringify(data));
});
//退出
jsBridge.xyAd.setUserId({
//用户ID留空则表示退出
user_id : ""
}, function(succ, data) {
alert(succ ? "已退出" : JSON.stringify(data));
});
监听回调数据: