uniapp中对接开发激励广告视频

官网地址:激励视频广告 | uni-app官网

我开发的app激励视频广告使用的是api的方式生成激励视频

核心语法

官方示例代码

复制代码
rewardedVideoAd.onLoad(() => {
  console.log('激励视频 广告加载成功')
})

rewardedVideoAd.show()
.then(() => console.log('激励视频 广告显示'))

app要传的是adpid,在hbulider广告联盟后台创建自己的adpid,

微信小程序要传的是adUnitId,在微信小程序的广告主后台获取这个值

复制代码
	showCustomAd(redPacket) {
				if (this.isVideoPlaying || !this.isPageAlive) {
					this.showToast("视频播放中,请稍候");
					return;
				}
				const that = this;
				const {
					adpid
				} = this.base.groupConfig;

				that.resetAdData();
				that.isVideoPlaying = true;

				uni.showLoading({
					title: "加载中...",
					mask: true
				});

				const orderNo = that.generateOrderNo();

				let adInstance = null;

              //生成app的激励视频
				//#ifdef APP-PLUS
				adInstance = uni.createRewardedVideoAd({
					adpid: adpid,
					urlCallback: {
						userId: uni.getStorageSync('userInfo').uid || '',
						extra: JSON.stringify({
							type: 2,
							no: orderNo,
							box: redPacket.source === "treasureChest" ? 1 : ''
						})
					}
				});
				//#endif


                //生成微信小程序的激励视频
				//#ifdef MP-WEIXIN
				adInstance = uni.createRewardedVideoAd({
					adUnitId: adpid,
				});
				//#endif

				that.ad.instance = adInstance;
				that.ad.currentRedPacket = redPacket; //红包
				that.ad.orderNo = orderNo; //提交订单号去后台

				adInstance.onLoad(() => {
					uni.hideLoading();
					setTimeout(() => {
						adInstance.show()
					}, 200)

				});

				adInstance.onError((err) => {
					uni.hideLoading();
					that.isVideoPlaying = false;
					that.cleanupAdInstance();
				});

				adInstance.onClose((res) => {
					uni.hideLoading();
					that.isVideoPlaying = false;
					if (res && res.isEnded) {
						that.handleVideoFinish(that.ad.currentRedPacket, that.ad.orderNo);
					} else {
						that.showToast("中途退出,领取失败");
					}

					//#ifdef APP-PLUS
					// 清理广告实例
					that.cleanupAdInstance();
					//#endif
				});

				//#ifdef MP-WEIXIN
				adInstance.show().catch(err => {
					adInstance.load().then(() => {
						return adInstance.show();
					}).catch(err2 => {
						uni.hideLoading();
						that.isVideoPlaying = false;
					});
				});
				//#endif
			},

提示:在正式开始之前,一定要多去看看官方文档,看看他们的写法和api的用法, 不要直接上手就去写,很浪费时间,而且用法不对,还会一直报错!多看文档多看文档!!!!

相关推荐
专科3年的修炼18 小时前
uni-app移动应用开发第四章
开发语言·javascript·uni-app
q55070717721 小时前
uniapp/uniappx实现原生图片编辑涂鸦、贴图、滤镜、旋转、裁剪等
uni-app
计算机学姐2 天前
基于微信小程序的校园失物招领管理系统【uniapp+springboot+vue】
java·vue.js·spring boot·mysql·信息可视化·微信小程序·uni-app
2501_915921432 天前
HTTPS前端劫持 新一代流量劫持解决方案
前端·网络协议·ios·小程序·https·uni-app·iphone
爱怪笑的小杰杰2 天前
优化 UniApp 日历组件的多语言切换:告别 setLocale 引起的 App 重启
java·前端·uni-app
计算机学姐2 天前
基于微信小程序的宠物服务系统【uniapp+springboot+vue】
java·vue.js·spring boot·mysql·微信小程序·uni-app·宠物
2501_915909062 天前
iOS应用签名的三种方法全解析:从官方到第三方工具
android·ios·小程序·https·uni-app·iphone·webview
心中无石马3 天前
uniapp引入tailwindcss4.x
前端·css·uni-app
fix一个write十个3 天前
【uniApp开发】微信小程序 web-view 内嵌 H5 跳转支付踩坑实录
微信小程序·uni-app
wuxianda10303 天前
苹果App上架4.3a被拒解决方案汇报总结
ios·uni-app·objective-c·cocoa·苹果上架·4.3a